How to display the system configuration name and Logo on the homepage of the website?

The website name and logo are the foundation of the brand image, which can not only quickly convey the identity of the website, but also enhance the user's trust and recognition.In AnQiCMS, presenting these important brand elements on the homepage is a direct and flexible task.AnQiCMS provides an intuitive backend setting and powerful template tag features, making this task very simple.

Background configuration: Unified management of brand information

Firstly, all information that needs to be displayed on the website front-end must be managed uniformly in the AnQiCMS backend.This ensures consistency of brand information and makes it convenient for operation personnel to adjust at any time.

To set the name and Logo of the website, you can:

  1. Enter the AnQiCMS backend management interface: This is the starting point for all website configurations.
  2. Navigate to 'Backend Settings'Find and click the 'Backend Settings' option in the left-hand menu bar.
  3. Select 'Global Function Settings'In the "Background Settings

In the "Global Function Settings" page, you will see several key configuration items:

  • Website NameThis is a text input box used to fill in the name of your website or brand.This name is usually used as a suffix for website titles and also appears as text identification in many places.Please enter the website name you want users to see on the homepage.
  • website logoHere is a picture upload area.You can click the upload button to upload your brand logo image to the server.AnQiCMS supports various image formats, and the uploaded images will be automatically managed.After uploading, the Logo image will be associated with your website.

After completing these configurations, remember to click Save to make your changes take effect.AnQiCMS's backend design makes the management of these key information very convenient, all updates in the backend will be quickly reflected on the website front-end.

If you have some unique brand slogans or auxiliary information you also want to display on the homepage, you can do so on the page of “Global Function Settings”『Custom Setting Parameters』Add to. You can name these custom parameters (for exampleBrandSlogan), and assign them the corresponding values (for example “Make content management easier”), which can be flexibly called in the template later.

Template call: Display brand information on the homepage

The background information is configured, the next step is to accurately present these data on the homepage of the website through AnQiCMS template tags. AnQiCMS template system uses syntax similar to Django template engine, with double curly braces{{变量}}Output the variable, using single curly braces and the percent sign.{% 标签 %}Call the function tag.

AnQiCMS provides a namedsystemA dedicated tag for retrieving all the information configured in the 'Global Function Settings'.

Display the website name.

To display the configured website name on the homepage, you can use it like thissystemTags:

{% system with name="SiteName" %}

This tag will directly output the website name you filled in the "Global Function Settings" on the backend.

To better organize the code and allow multiple references to the same data in the template, you can assign the obtained website name to a variable:

{% system siteName with name="SiteName" %}
<!-- 在这里，您可以多次使用 {{siteName}} 来显示网站名称 -->
<h1>欢迎来到 {{siteName}}</h1>
<p>&copy; {{siteName}} 版权所有</p>

This code first retrieves the latest 5 articles by{% system siteName with name="SiteName" %}Store the website name configured in the background to a variable namedsiteNameand then you can refer to it at different positions on the page{{siteName}}.

Display the website logo

Similar to the website name, displaying the website Logo alsosystemis achieved through tags. You need to obtain the URL of the Logo image and<img>Tagssrcuse it as the attribute value.

{% system with name="SiteLogo" %}

Similarly, we recommend assigning it to a variable for management:

{% system siteLogo with name="SiteLogo" %}
{% system siteName with name="SiteName" %}

<a href="/">
    <img src="{{siteLogo}}" alt="{{siteName}} Logo" class="website-logo">
</a>

Here,{{siteLogo}}It will output the complete URL of the Logo image. It is worth noting that we also obtainsiteNameand use it as<img>TagsaltProperty value. This is a good practice, not only helpful for SEO optimization, but also provides meaningful text alternatives when images cannot be loaded, enhancing user experience.class="website-logo"This style class can conveniently control the display effect of the Logo through CSS.

Calling a custom parameter

If you added a custom parameter (such asBrandSlogan), you can also usesystemtags:

{% system brandSlogan with name="BrandSlogan" %}
<p>{{brandSlogan}}</p>

This will display your custom slogan content on the page.

Deployment and file location

This template code needs to be placed in your website template file.In most cases, the logo and website name will appear in the public header area of the website./templateEach topic has its own independent folder under the directory.

You need to find the template folder currently in use, and then edit the contents ofindex.html(Website Home Template) or the common header file (e.g.partial/header.html) Insert the above code snippet into the appropriate position. If your website uses a common bash.htmlorpartial/header.htmlTo build the page header, then place these tags in these common files, it can ensure that all pages of the website can display the name and Logo uniformly without repeating the code on each page.

Summary

Through the concise and intuitive backend configuration and powerful template tag functions of AnQiCMS, you can easily display the brand name and Logo of your website on the homepage and maintain consistency on all pages.This design not only improves the efficiency of content management, but also provides flexible and reliable support for the brand display of the website.

Common Questions (FAQ)

  1. Why did the homepage not update immediately after I modified the website name or Logo in the background?This may be due to system cache.AnQiCMS to improve website access speed, will enable the cache mechanism.When you modify the configuration in the background, you may need to manually clear the system cache to make the front-end page display the latest content immediately.You can find the "Update Cache" feature in the left menu of the background management interface, click to execute it.
  2. Can I display other custom text or images on the homepage besides the website name and Logo?Of course, you can.In AnQiCMS backend's 'Global Function Settings' page, you can use 'Custom Setting Parameters' to add any text or image link you want to display on the homepage or other pages.ServiceHotline），and call it through the template.{% system with name="ServiceHotline" %}method.
  3. If my logo image file is too large, will it affect the website loading speed? Does AnQiCMS have a solution?The image size indeed affects the website loading speed.AnQiCMS in the 'Background Settings' -> 'Content Settings' provides multiple image optimization features.You can choose to "turn on Webp image format