How to use AnQiCMS built-in tags to control the display logic of content?

In AnQiCMS, the built-in tag system is the core tool for you to control the logic of website content display.它提供了一套强大且灵活的语法,让您无需编写复杂的后端代码,就能在模板文件中精确地控制内容的获取、筛选、排序、格式化乃至最终的布局。This system is similar to the Django template engine syntax, easy to use, and can help you convert technical details into intuitive display effects.

Basic structure of AnQiCMS tags

AnQiCMS's tag system is mainly composed of two basic elements:

  1. Variable output tag ({{ 变量名 }}): Used to display data directly on the page, such as getting the article title{{ item.Title }}.
  2. Logical control label ({% 标签名 参数 %}): Used to handle various logic, such as conditional judgments, loop traversals, importing files, etc., these tags usually need a{% end标签名 %}to close.

Understanding these two tags is the key to deeply using AnQiCMS templates. All tags and variables are strictly case-sensitive, and consistency must be maintained when using them.

Get and display content: data-driven display logic

AnQiCMS provides various tags to retrieve different types of content, you can choose the appropriate tag according to your needs:

  • List data acquisition:

    • archiveList: Used to get the document list under articles, products and other models. You can setmoduleIdSpecify a model (such asmoduleId="1"Get articles),categoryIdFilter categories,limitControl quantity,.type="page|list"Choose pagination or regular list,.orderDefine sorting rules, etc.
    • categoryList: Get category list. Often used to display navigation menus or sidebar categories. You can throughparentIdSpecify the parent category, even to get the child or sibling categories of the current category.
    • pageList: Get the list of single-page, such as 'About Us', 'Contact Us', etc.
    • tagList:Get the list of tags, commonly used to build popular tag clouds or related tags.
    • navList:Get the website navigation menu configured in the background. Supports multi-level navigation.

    When you get the list data, you usually combine{% for %}loop tags to iterate through and display one by one:

    {% archiveList archives with type="list" categoryId="1" limit="5" %}
        {% for item in archives %}
            <li><a href="{{ item.Link }}">{{ item.Title }}</a></li>
        {% empty %}
            <li>当前分类下暂无内容。</li>
        {% endfor %}
    {% endarchiveList %}
    

    The above code will display the titles of the first 5 articles with category ID 1, if the list is empty, it will show 'There is no content under the current category.'

  • Details data acquisition:

    • archiveDetail:Retrieve detailed information of a single document. On the article detail page, usually no ID needs to be specified, it will automatically retrieve the document information of the current page. You can specifyname="Title"to get the title,name="Content"retrieve content, etc.
    • categoryDetail:Get detailed information of a single category, such as category title, description, link, etc.
    • pageDetail:Get detailed information of a single page.
    • tagDetail:Get detailed information of a single tag.
    • system:Get global system settings, such as website nameSiteName、Website LogoSiteLogoCom备案 numberSiteIcpetc.
    • contact:Get contact information configured in the background, such as phone numberCellphone、Contact emailEmailetc.
    • tdk:Get the current page's SEO information, such as the titleTitle、KeywordsKeywordsand descriptionDescription.

    These tags are usually used for page header SEO settings, detailed page content display, or footer information display:

    <title>{% tdk with name="Title" siteName=true %}</title>
    <meta name="keywords" content="{% tdk with name="Keywords" %}">
    <meta name="description" content="{% tdk with name="Description" %}">
    
    
    <h1>{% archiveDetail with name="Title" %}</h1>
    <div>{{ archiveDetail with name="Content" | safe }}</div>
    

Logic Control and Conditional Display

In content display, we often need to decide whether to display a certain element or what kind of content to display based on specific conditions.{% if %}Tags are the core of this logic:

  • Conditional judgment:

    {% if item.Thumb %}
        <img src="{{ item.Thumb }}" alt="{{ item.Title }}">
    {% else %}
        <img src="{% system with name="DefaultThumb" %}" alt="默认图片">
    {% endif %}
    

    This code will determine if the article has a thumbnail, if it does, it will display it; otherwise, it will display the default system thumbnail.

  • Multiple conditional judgmentsYou can use{% elif %}and{% else %}Process more complex logic, such as judging user permissions, content types, etc.

Data formatting and conversion

AnQiCMS provides a series of filters (|) And dedicated tags to handle data formatting, ensure content is presented in **style:

  • Date and time:stampToDateLabels can format timestamps into readable date and time strings. It should be noted that the format parameters follow the specific time formatting standards of the Go language (such as2006-01-02 15:04:05).

    <span>发布日期:{{ stampToDate(item.CreatedTime, "2006年01月02日") }}</span>
    
  • Text content processing:

    • |safeThis is a very important filter used to display content in the rich text editor or strings containing HTML tags.It can prevent HTML tags from being escaped, ensuring the page is rendered correctly.
    • |truncatechars:N:Truncate a string to a specified number of characters and add “…” at the end
    • |default:"默认值":Display a predefined default value when the variable is empty or does not exist.
    • |render:If your content is in Markdown format, this filter can render it as HTML.
    • |replace:"旧词,新词"[en]: Replaces a specific substring in a string.
    • |split:"分隔符"and|join:"分隔符":Used for conversion between strings and arrays.
    <p>{{ item.Description | truncatechars:100 }}</p> {# 截取前100个字符 #}
    <p>{{ item.Content | render | safe }}</p> {# 渲染Markdown内容并确保HTML正确显示 #}
    

Reusability and organization of template code

To improve efficiency and maintainability, AnQiCMS supports template inheritance, inclusion, and macro definitions:

  • {% include "路径/文件名.html" %}Insert the content of another template file at the current position. This is very suitable for reusing common modules such as headers, footers, and sidebars. You can also throughwithParameters are passed to the template that includes the variable.
  • {% extends "基础模板.html" %}and{% block 名称 %}:To implement template inheritance. You can define a basic layout (such as)base.html),which contains the page skeleton, and then child templates overwrite it.blockFill in specific content without