When building a website, we all hope that the content can change flexibly according to different pages and different data, rather than being static text that never changes.AnQiCMS with its high-performance architecture based on Go language and flexible Django-like template engine, provides us with powerful dynamic content display capabilities.And everything at the core, cannot be separated from the definition and use of 'variables'.
Master how to define and use variables in AnQiCMS templates, just like having the key to unlock the dynamic vitality of the website.This is not just a technical operation, it is also a critical step in achieving content marketing, SEO optimization, and enhancing user experience.
Core: Basic definition and usage of variables
AnQiCMS's template syntax is concise and intuitive, it follows the style of Django template engine. The most direct way is to use double curly braces{{ 变量名 }}To display dynamic content. When the system renders the page, it will look for the variable names within these curly braces and replace them with the actual data.
The variable naming usually follows camelCase naming convention, for examplearchive.Idorarchive.TitleHere,archiveusually represents the content entity loaded on the current page, such asIdandTitlewhich are the attributes of the entity.
Data obtained from the system built-in tags
AnQiCMS has preset a large number of template tags for us, these tags will implicitly 'inject' data from the background configuration or database into the template environment when called, allowing us to use them as variables.
Global site and contact information:If you want to display the company name, contact number, filing number, and other global information at any location on the website, you can use
systemandcontacttags. For example, to display the website name:{% system siteName with name="SiteName" %}{{ siteName }}Here,systemLabel obtained the system configuration named “SiteName” and assigned it tositeNamethe variable, and then we go through{{ siteName }}Display it. Similarly, to display the contact phone number, you can do it like this:{% contact cellphone with name="Cellphone" %}{{ cellphone }}.Page-specific information (TDK):Each page's title (Title), keywords (Keywords), and description (Description) are crucial for SEO.
tdkThe label can dynamically obtain this information. For example, in<title>The label displays the page title:<title>{% tdk with name="Title" siteName=true %}</title>Here,siteName=trueIt indicates that the website name will be automatically added after the page title, enhancing brand recognition.Content detail page:When we access a specific article or product page, the main content of the page is the most typical dynamic information.
archiveDetailLabels are used to retrieve detailed data of the current document, which can be accessed directly byarchive.属性名in the form of, such as{{ archive.Title }}will display the article title,{{ archive.Content }}It will display the article content. For example, on an article detail page, we can display the content like this:<h1>{{ archive.Title }}</h1> <div> 发布时间:{{ stampToDate(archive.CreatedTime, "2006-01-02") }} 阅读量:{{ archive.Views }} </div> <div class="article-content"> {{ archive.Content|safe }} </div>Here
archive.Title/archive.CreatedTimeandarchive.ViewsThey are all directly usable variables.archive.ContentThe following|safeis a filter that tells the template engine that this content is safe HTML and does not need to be escaped, ensuring that formatted content in rich text editors is displayed correctly.
Define and use variables in a loop
Websites often need to display list data, such as article lists, product lists, etc.forLoop tags are a powerful tool for handling such dynamic content, they will assign the data of the current item to a temporary variable in each iteration.
For example, displaying a list of articles:
{% archiveList archives with type="page" limit="10" %}
{% for item in archives %}
<li>
<a href="{{ item.Link }}">
<h3>{{ item.Title }}</h3>
<p>{{ item.Description|truncatechars:100 }}</p>
<span>发布日期:{{ stampToDate(item.CreatedTime, "2006-01-02") }}</span>
</a>
</li>
{% empty %}
<li>目前还没有任何文章。</li>
{% endfor %}
{% endarchiveList %}
In this example,archivesYesarchiveListLabel gets the set of articles, and{% for item in archives %}statement makesitemthe current article object in each loop. We can access the attributes of each article throughitem.Link/item.Titleetc.item.Description|truncatechars:100demonstrates how to usetruncatecharsFilter and extract the description content to prevent it from being too long.
Advanced: Create and operate variables within the template.
In addition to obtaining data from built-in tags, we can also declare and operate variables directly in the template, which brings greater flexibility to template design.
UsewithLabel to define a temporary variable
{% with ... %}Labels allow you to define temporary variables in a local scope, these variables are only valid withinwiththe start and end of a label. This is useful when you need to assign a specific block orincludeThe template fragment is very convenient when passing parameters.
{% with headerTitle="我的博客首页" headerKeywords="技术,分享,CMS" %}
<head>
<title>{{ headerTitle }}</title>
<meta name="keywords" content="{{ headerKeywords }}">
</head>
{% endwith %}
Here,headerTitleandheaderKeywordsOnlywithavailable inside the tag. If we pass them to a publicheader.htmltemplate, it can be written like this:{% include "partial/header.html" with title=headerTitle keywords=headerKeywords %}
UsesetTags declare more flexible variables
{% set ... %}Tags provide broader variable declaration capabilities.It defines variables that are available in the current template file, not just limited to a block, which is very useful when performing some calculations or storing intermediate results.
`twig {% set greeting = “Welcome to the world of AnQiCMS!” %}
{{ greeting }}
{#