AnQiCMS provides a flexible and powerful template system, adopting a syntax style similar to Django template engine, which allows experienced developers to quickly get started and is also very intuitive. Even users unfamiliar with template language can dynamically present website content through simple learning.This system makes data interaction with the front-end page efficient and easy to manage with its concise labels and variable usage.
To fully utilize the AnQiCMS template for dynamic data display, we need to understand its core syntax structure: variables, tags, and filters.
Understand Variables: The Direct Method of Outputting Data
In AnQiCMS templates, variables are the main way to directly output backend data to the front-end page. They are usually used with double curly braces{{ 变量名 }}Define it.When the page is requested, AnQiCMS will parse these variables and replace them with the corresponding actual data.{{ archive.Title }}.
It is worth noting that variable names usually follow the camelCase naming convention, that is, the first letter of each word is capitalized, for example,archive.Idrepresents the ID of the article,archive.CreatedTimeRepresents the creation time of the article. This naming convention makes the meaning of variables clear at a glance.
Use tags to achieve logic control and data retrieval
Tags are the core of the AnQiCMS template system that implement logic control and execute specific functions. They are represented by single curly braces and the percent sign{% 标签名 %}The form appears in the form of ...{% if ... %}{% endif %}or{% for ... %}{% endfor %}.
Data retrieval tagAnQiCMS内置了多种数据获取标签，让您能够轻松地从数据库中提取所需信息。
archiveDetailandarchiveList[en]: Used to get the details of a single article or a list of multiple articles. For example,{% archiveDetail with name="Title" %}you can get the title of the current page's article,{% archiveList archives with type="page" limit="10" %}and it can get a paginated list of articles and assign it toarchivesVariables. These tags usually acceptid(ID),categoryId(Category ID),moduleId(Model ID),order(Sorting method) and other parameters to help you accurately filter the required data.categoryDetailandcategoryList：Used to get category details or category list. You can build complex category navigation structures according tomoduleIdandparentIdparameters.systemandcontact：These tags are used to get the global settings of the website (such as the website nameSiteNameCom备案 numberSiteIcp) and contact information (such as phone number)CellphoneCom emailEmail).- also
pageDetail/pageListfor single page content,tagDetail/tagList/tagDataListUsed for label-related data, as well aslinkListused for friend links, etc., all working with similar parameters and methods.
Control flow tagsThese tags enable templates to have logical capabilities like programming languages.
ifConditional judgment:{% if condition %}{% elif another_condition %}{% else %}{% endif %}The structure allows you to display different content based on different conditions. For example,{% if archive.Thumb %} <img src="{{ archive.Thumb }}" /> {% else %} <img src="/default-thumb.png" /> {% endif %}You can choose to display different images based on whether the article has a thumbnail.forto iterate:{% for item in collection %}{% empty %}{% endfor %}Used to iterate over lists or arrays. When the collection is empty,{% empty %}the content within the block will be executed. Inside the loop,itemthe variable represents the current element being iterated, and you can also useforloop.CounterGet the current loop index.
Functional tag
stampToDate: This is a very practical feature that can format Unix timestamps into readable date and time strings. For example,{{ stampToDate(item.CreatedTime, "2006-01-02 15:04") }}Display the article creation time in the format of “Year-Month-Day Hour:Minute”.pagination: is used to generate pagination navigation, usually witharchiveListused together to allow users to browse a large list of content.breadcrumb：Automatically generates breadcrumb navigation, enhancing the website's user experience and SEO-friendliness.withandset:{% with key="value" %}{% endwith %}and{% set new_var = "value" %}Used to define temporary variables in templates, facilitating complex logic or data transmission.
Master the Filter: A Powerful Tool for Data Beautification and Transformation
Filters are a powerful tool in the AnQiCMS template system for processing and formatting variable outputs. They are represented by vertical bar symbols|Applied after the variable, such as{{ 变量 | 过滤器名:参数 }}.
safe: When you need to output a variable containing HTML content (such as the main content of the articlearchive.Content）when, in order to avoid HTML tags being escaped to plain text, it is necessary to use|safefilter. For example:{{ archive.Content|safe }}.truncatechars/truncatewords: is used to truncate a string to a specified length and automatically add an ellipsis.truncatecharstruncated by character count,truncatewordsTruncate by word count, with corresponding_htmlVersion for safely handling HTML content.add/replace/split/joinConcatenating strings, replacing, splitting into an array, or joining an array into a string, etc. For example,{{ "Hello AnQiCMS"|replace:"AnQi,Go" }}.upper/lower/capfirst/titleConvert the case of English strings.thumbFor image path variables,|thumbThe filter can quickly obtain its thumbnail version.renderWhen you enable the Markdown editor in the background, the content will be stored in Markdown format by default. Use|renderThe filter can be converted to HTML format and displayed on the front end.
Actual operation example: dynamically build a page
Assuming we are building a homepage to display the latest list of articles, and we want each article to include the title, abstract, publication date, and thumbnail.
Get the website name, for use in the page title
Latest Articles
{# Use the archiveList tag to get the list of articles, type list, limit 10, and display the flag attribute #} {% archiveList latest_archives with type="list" limit="10" showFlag=true %} {% for article in latest_archives %}{{ article.Title }}
<div class="article-body">
{# 检查是否有缩略图，如果有则显示 #}
{% if article.Thumb %}
<a href="{{ article.Link }}" class="article-thumb">
<img src="{{ article.Thumb }}"