How to flexibly call system global configuration information in website templates for display?

Flexibly calling system global configuration information in the website template is a key step in building a dynamic and easy-to-maintain website.AnQiCMS (AnQiCMS) fully understands this need and therefore provided powerful and intuitive template tags from the very beginning, allowing users to easily display preset system-level data, contact information, and even custom information at any position on the page.

The template system of Anqi CMS adopts syntax similar to Django template engine, where variables are usually enclosed in double curly braces{{ 变量名 }}To define, and various operations and tags are through single curly braces and percent signs{% 标签名 %}To implement. This design ensures that the template code is clear and easy to read. To call global configuration information, we will mainly usesystem/contactandtdkthese three core tags, as well as one for fully customizing the content.diyLabel.

Call system-level basic configuration information (systemLabel)

When we need to display the website name, Logo, filing number and other basic information in the page header, footer, or any general area of the website,systemThe label is our helpful assistant. This label can obtain preset data from the "global settings".

For example, to display the name of the website, we can write it like this in the template:

<title>{{ title }} - {% system with name="SiteName" %}</title>

This code will first retrieve the title of the current page, and then append it to the website name set in the background. If you want to get the logo image and display it, you can do it like this:

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

Here we not only display the Logo image, but also wrap it into a link pointing to the homepage address of the website. Similarly, the website's filing number (SiteIcp) and copyright information (SiteCopyright) 也能被轻松调用：

<p>
    <a href="https://beian.miit.gov.cn/" rel="nofollow" target="_blank">{% system with name="SiteIcp" %}</a>
     {% system with name="SiteCopyright" %}
</p>

In addition,system标签还能获取到网站的基础URL (BaseUrl)、移动端URL (MobileUrl)、当前模板的静态文件路径 (TemplateUrl) as well as site language (Language) This information is convenient for resource reference and multilingual adaptation. For example, when referencing template CSS files:

<link href="{% system with name="TemplateUrl" %}/css/style.css" rel="stylesheet">

It is worth mentioning that if you have enabled the multi-site management feature in the AnQi CMS backend and want to call data from other sites in the current template, you cansiteIdParameter to specify, for example{% system with name="SiteName" siteId="2" %}.

Call the website contact information (contactLabel)

The contact information of the website, such as phone number, address, email, social media links, etc., often needs to be managed uniformly and displayed on multiple pages.contactLabels are born for this, it directly gets data from the "Contact Information Settings" in the background.

To display the contact phone number of the website, we can do it like this:

<div>联系电话：{% contact with name="Cellphone" %}</div>

Or you can contact the email address:

<div>邮箱：<a href="mailto:{% contact with name="Email" %}">{% contact with name="Email" %}</a></div>

If the WeChat QR code is configured on the back-end, the display is also very simple:

<div>
    <img src="{% contact with name="Qrcode" %}" alt="微信二维码" />
</div>

contactLabels not only support these built-in fields, but also allow users to customize parameters in the "Contact Information Settings" backend, such as adding a "WhatsApp contact method". Once defined, it can be called like built-in fields:

<div>WhatsApp：{% contact with name="WhatsApp" %}</div>

Control the SEO meta information of the pagetdkLabel)

SEO (Search Engine Optimization) is crucial for the visibility of a website. The pagetitle/keywordsanddescriptionis an indispensable part of it.tdkTags are specifically used to obtain this metadata and support flexible display methods. This information also comes from the "Home Page TDK Settings" on the backend or the SEO configuration of each content detail page.

In<head>Area, we usually use it like thistdkTags:

<title>{% tdk with name="Title" siteName=true sep="_" %}</title>
<meta name="keywords" content="{% tdk with name="Keywords" %}">
<meta name="description" content="{% tdk with name="Description" %}">

Here,TitleTagssiteName=trueWill automatically add the website name to the end of the page titlesep="_"It defines the separator between the title and the website name.

For a canonical URL, this is an important SEO practice to avoid duplicate content issues.tdkTags can also get it, but we usually judge whether it exists first:

{%- tdk canonical with name="CanonicalUrl" %}
{%- if canonical %}
<link rel="canonical" href="{{canonical}}" />
{%- endif %}

This ensures that standard link tags are only output when necessary.

Flexible customization of global variables (diyTags and custom parameters)

In addition to the above standardized configuration information, sometimes we may need to define some completely customized global variables in the background, such as the link of a marketing activity, a notification text, etc. Anq CMS provides two ways to implement this customization:

1. InsystemorcontactAdd custom parameters in tags:As wecontacttag.WhatsApplike, add custom parameters in "Global Feature Settings" or "Contact Information Settings": (for example)HelpUrl). Then, use the correspondingsystemorcontactlabels toname="HelpUrl"The form of calling in English.

   <div>帮助页面：{% system with name="HelpUrl" %}</div>
   

2. UsediyTags: diyThe tag is a more general custom content tag, which directly corresponds to any global field customized by the user in the background.

   For example, in the background, we defined a field namedAuthorThe parameter, can be accessed in the template like this:

   <div>网站作者：{% diy with name="Author" %}</div>
   

This flexible custom feature allows us to extend and call various personalized global configurations according to the specific needs of the website.

Through these built-in template tags, the security CMS greatly simplifies the process of calling global configuration information.We only need to set the corresponding values in the background, and then use concise tag syntax in the template to achieve dynamic display and efficient management of website content.This not only improves the development efficiency, but also makes the post-maintenance and content update of the website more convenient.

---

Common Questions (FAQ)

1. **问：If I modify a global configuration in the background, but the front-end page