How to display website name and Logo in AnQiCMS?

The website's name and logo are like the face of the brand, they are not only the first impression visitors have of you, but also an important manifestation of the professionalism and recognition of the website.In Anqi CMS, setting and displaying your website name and logo is a straightforward and efficient process.Next, we will explore how to perfectly present these key elements on your website.

First, set the website name and logo in the background

To have a dedicated name and logo for your website, the first step is to configure it in the Anqi CMS backend management interface.

1. Enter global settings: Log in to your Anqi CMS backend, you will see a series of function options in the left navigation bar. Find and click on "Backend Settings", then select the "Global Settings" from among them.
2. Configure website nameIn the global settings page, you will find an input box named "Website Name".Enter the name you want the website to display externally, such as your company name, brand name, or personal blog name.This name is usually used as a suffix for web page titles and also has a certain effect on search engine optimization (SEO).
3. Upload Website LogoFollowing the website name, there is usually an option to set the 'website logo'.Click the upload button and select the Logo image file you have prepared in advance.The AnQi CMS supports various image formats and will automatically perform some optimization processing.After upload, the Logo image will be displayed in the preview area.
4. Save ChangesAfter completing the entry of the website name and uploading the Logo, please be sure to click the "Save" or "Submit" button at the bottom of the page to ensure that your settings take effect.

By following these steps, your website name and Logo have already been configured in the system background. But at this moment, they will not be displayed immediately on your website front-end.

Next, call to display in the frontend template

After the configuration is complete, the next step is how to display this information on the website front end.AnQi CMS uses a template engine to control the display of the website, which means you need to edit the template files to call the data set in the background.

1. Locate the template fileThe header area of a website is typically the ideal location for displaying the website name and logo. In AnQiCMS, common template files such asbash.htmlorheader.htmlThese names may vary depending on the template) will include these common elements. These files are usually located/templatein the folder of the template you are currently using.

2. The name of the website called: To display the website name you set in the background, you can use the system tags provided by AnQiCMS. Insert the following code at the corresponding position in the template file:

   {% system with name="SiteName" %}
   

   This code will directly output the text you enter in the "Website Name" field in the background. For example, you can place it in<title>tags, or some part<h1>Tag inside.

3. of calling the website logo: For the website logo, the system tag is also used for the call. The logo is usually embedded in the page in the form of a tag and it is recommended to add<img>a tag in the page and it is recommended to addaltProperties to enhance accessibility and SEO friendliness.

   <img src="{% system with name="SiteLogo" %}" alt="{% system with name="SiteName" %}" />
   

   Here, srcThe attribute points to the address of the Logo image you uploaded, andaltThe attribute cleverly uses the website name as alternative text, ensuring that meaningful text descriptions are displayed even if the image cannot be loaded.

4. Save template fileAfter modifying the template file, remember to save your changes. If you are editing the template code in the background, the system will usually save it automatically.

By these two steps, your website name and Logo will be presented elegantly on the front page of the website according to your settings.The AnQi CMS template system is flexible and powerful, allowing you to easily display these core elements without writing complex code.

Frequently Asked Questions (FAQ)

1. I modified the website name or logo, but it did not take effect on the front end immediately, why is that?This is likely due to caching. Anqi CMS generates cache files to improve website access speed.After you modify the settings in the background, if the front-end does not update immediately, you can try clearing the system cache.Generally, click clean in the 'Update Cache' feature of the background management interface.In addition, your browser may also cache old pages, try clearing the browser cache or access the website in incognito mode.

2. Can I set a different website name or logo for different pages of the website?By{% system with name="..." %}The label called website name and Logo, is a system-level global setting, which means they remain consistent throughout the entire website.If you have a need to set a unique name or logo for a specific page, this usually requires more advanced template customization.You can define custom fields to store different logo images or names in the page management for specific pages, then call these custom fields in the page template using conditional judgments or page detail tags to override global settings.This will increase the complexity of the template, and it is usually not recommended to frequently change the core logo for the sake of maintaining brand image consistency.

3. My logo image is displayed incorrectly after uploading, how can I adjust it?The size and position of the logo are usually controlled by the CSS style of your website template.When uploading images, the Anqi CMS may perform compression or cropping, but the final display effect depends on the template style.You can try to adjust the width, height, or margin of the Logo image using CSS code to meet the design requirements.If you are not familiar with CSS, you can seek help from a template developer or a frontend designer, or check the backend global settings to see if there are any preset options related to Logo size.