system/contactandtdkThese three core tags help you seamlessly integrate the background configuration into various pages of the website.
Get the global configuration of the website:systemApplication of tags
When you need to display the global information of the website such as the brand name, Logo, filing number, or core address, systemThe tag is your helpful assistant. This tag can directly read the preset values from the 'Global Function Settings' of the AnQiCMS backend and present them on the website front end.
to usesystemTags, you usually specify the name of the configuration item you want to retrieve. For example, to display the name of the website, you can use it like this:
<div>网站名称：{% system with name="SiteName" %}</div>
If you want to display the website's logo image, make sure it links to the homepage, and has good SEO practices (alt attribute), you can write it like this:
<a href="{% system with name="BaseUrl" %}">
<img src="{% system with name="SiteLogo" %}" alt="{% system with name="SiteName" %}" />
</a>
Here we simultaneously calledSiteLogoto get the logo image address,SiteNameto get the website name as the alt text for the image, as well asBaseUrlto get the website homepage address.
Additionally, like the record number (SiteIcp）、Copyright Information（SiteCopyright）、Template Static File Address（TemplateUrlUsed to import CSS or JS files), or even parameters customized in the background, can all be retrieved in a similar manner. For example, if you have customized a parameter named 'HelpUrl' to store the link to the help page, you can call it like this:
<a href="{% system with name="HelpUrl" %}" target="_blank">帮助中心</a>
By doing so, you can ensure that all pages use the latest global configuration information uniformly, without modifying the template code, which greatly improves the maintainability of the website.
Display corporate contact information:contactUsage of tags
A clear and convenient contact method is the bridge to build trust and communication with users. AnQiCMS'scontactTags are specifically used to retrieve and display the various information items in the "Contact Information Settings" backend. Whether it's a phone number, email, address, or various social media links, it can handle them effortlessly.
Assuming you want to display the company's contact phone number and email on the footer of the website or the 'Contact Us' page, you can call it like this:
<div>
<p>联系电话：{% contact with name="Cellphone" %}</p>
<p>联系邮箱：<a href="mailto:{% contact with name="Email" %}">{% contact with name="Email" %}</a></p>
</div>
If you have set up the WeChat QR code in the backendQrcodeand hope to display it on the front end for users to scan and add, which can be implemented in this way:
<div>
<img src="{% contact with name="Qrcode" %}" alt="微信二维码" />
<p>微信号：{% contact with name="Wechat" %}</p>
</div>
For social media platforms such as Facebook or LinkedIn, if there is a configuration on the backend, the link can also be accessed through it.name="Facebook"orname="Linkedin"In the same way,contactThe tag also supports calling the contact parameters you have customized on the backend, which provides great flexibility in meeting specific display needs.
Optimize page SEO:tdkThe essence of the tag
TDK (Title, Description, Keywords) is the foundation of website SEO, directly affecting the display effect and ranking of the page in search engine results. AnQiCMS'stdkTags are born for this, they can intelligently retrieve the SEO title, keywords, description, and canonical URL (Canonical URL) of the current page.
On each page,<head>you will usually see such TDK settings:
<title>{% tdk with name="Title" %}</title>
<meta name="keywords" content="{% tdk with name="Keywords" %}">
<meta name="description" content="{% tdk with name="Description" %}">
tdkThe strength of labels lies in their intelligence.It will automatically obtain the corresponding TDK information according to the type of the current page (home page, article detail page, category list page, etc.).For example, on the article detail page, it will display the unique SEO title, keywords, and description of the article; while on the category list page, it will display the TDK of the category.
For page titlesTitle,tdkthe tags also provide several practical attributes to further control their display:
siteName=trueThe website name will be automatically appended after the page title.For example, if the page title is 'About Us' and the website name is 'AnQi CMS', then the final displayed title may be 'About Us - AnQi CMS'.sep="_"The [en] translates to: Allow you to customize the separator between the page title and the website name, the default is a hyphen.-.showParent=trueIn category or article pages, if the content has a parent category, this attribute determines whether the title of the parent category is displayed in the title. For websites with deep hierarchies, this helps to improve the descriptiveness of the title.
For example, a title that displays the parent category title and uses an underscore as a separator:
<title>{% tdk with name="Title" siteName=true sep="_" showParent=true %}</title>
In addition,tdkThe label can also retrieve the page's canonical URL, which is crucial for avoiding duplicate content and concentrating page weight:
{%- tdk canonical with name="CanonicalUrl" %}
{%- if canonical %}
<link rel="canonical" href="{{canonical}}" />
{%- endif %}
Here, a conditional judgment is used to ensure that only when the standard link exists is output<link rel="canonical">Tags, this is a robust practice
Summary
system/contactandtdkThese three tags are the foundation of AnQiCMS template development. They tightly connect the global configuration, contact information, and SEO metadata of the website with the front-end display.By flexibly using these tags, you can build a highly consistent, easy-to-manage, and search engine-friendly website, thereby better serving your users and achieving your operational goals.Understand and master them, and it will make your AnQiCMS website operation twice as effective.
Common Questions (FAQ)
1. If a certain setting is not made in the back endsystemorcontactWhat will be displayed when the field is called by the front-end?Answer: If the back-end has not set up for a certainsystemorcontactField setting value, the front-end will usually return an empty string when calling this label.This means that at this location, no content will be displayed on your website, so you can judge these empty values as needed when designing the template, or set default placeholder text.
2.tdkThe TDK information obtained by the tag is for the entire website or for the current page?Answer:tdkThe intelligence of the label lies in itscontext awarenessis.This means it will automatically retrieve and display the corresponding TDK information based on the type of the current accessed page (such as the homepage, article detail page, category list page, single page, etc.)For example, on the homepage, it will display the content you have configured in the "Homepage TDK Settings" in the background; on the article detail page, it will display the TDK set independently for that article.This design greatly simplifies SEO management, ensuring that each page has its unique optimization information.
3. Can I call different site (multi-site function) in the same template file?systemorcontactinformation?Answer: Yes. The multi-site function of AnQiCMS is very powerful, in order to support cross-site data calling,system/contactandtdkall tags support onesiteIdparameter. You can access it viasiteId="X"[Specify which site's configuration information to retrieve by using (where X is the ID of the target site).]This is very useful for building a multi-site network that shares some global information, such as unified copyright information or contact details of the group headquarters.