How to use variables and control tags in AnQiCMS templates?

AnQi CMS, an enterprise-level content management system built on the Go language, with its efficient, secure, and flexible features, provides strong support for content operators and enterprise users.In AnQiCMS, content is not just static text and images, through its carefully designed template engine, we can transform data into vivid and personalized website pages.Understanding how to use variables and control tags in the AnQiCMS template is a key step in unleashing its powerful customization capabilities.

AnQiCMS's template engine adopts a syntax similar to Django or Blade, which means developers familiar with these front-end template languages will feel very comfortable.It makes dynamic content rendering easy and intuitive.Template files are usually named with.htmlStored neatly as a suffix/templateIn the directory, while the accompanying styles, scripts, and images are stored independently./public/static/In the directory, maintaining a good organizational structure.

Variables: the magic that brings content to life.

In AnQiCMS templates, variables are the main means to display dynamic data.Imagine if the title, article content, and product prices of a website all had to be manually modified, it would be so cumbersome.The introduction of variables is to solve this problem.

When you need to display a dynamic piece of information on a page, such as the title of the current article, the name of the website, or the contact phone number, you just need to enclose the variable name in double curly braces, like this:{{ 变量名称 }}. AnQiCMS variable naming follows camel case, that is, the first letter of each word is capitalized, for examplearchive.Titlemeans the title of the article,system.SiteNameIt represents the name of the website. This clear naming convention allows developers to quickly understand the content pointed to by the variable.

For example, if we want to display the title and publication time of a blog post, it might be written like this:

<h1>{{ archive.Title }}</h1>
<p>发布时间：{{ stampToDate(archive.CreatedTime, "2006-01-02") }}</p>

here,archive.TitleWe can directly use the title field of the current article object.archive.CreatedTimeThe timestamp is retrieved using the built-in AnQiCMSstampToDateFunction (in AnQiCMS, it is treated as a tag function), format it into the familiar "year-month-day" form. AnQiCMS has built-in tags to retrieve different types of data, such assystemTags are used to retrieve global settings (such asSiteName/SiteLogo)contactTags are used to retrieve contact information (such asCellphone/Email)archiveDetailTags are specifically used to retrieve article details, they can all be accessed throughnameparameters to specify the specific fields to be retrieved.

In addition to directly outputting variables, AnQiCMS also provides powerful "filters" (Filters) that allow us to further process the output of variables. Filters are applied using the pipe character|Connected after the variable, for example{{ obj|filter__name:param }}. A common use case is to handle rich text content, in order to prevent XSS attacks, the template engine defaults to escaping HTML tags.If we need to display the HTML content generated by the editor, we must use|safeFilter to declare content as safe, allowing the browser to parse normally, for example{{ archive.Content|safe }}In addition, there is also|truncatechars:9Used to truncate the string and add an ellipsis,|lowerUsed to convert strings to lowercase, as well as|add:2Used for adding numbers, etc., these filters greatly enhance the flexibility of variable output.

Control tags: the skeleton for building page logic

Just having dynamic data is not enough, a fully functional website also needs to display different content based on different conditions, or traverse list data.This is where the control tags come into play. In AnQiCMS templates, control tags are defined using single curly braces and percent signs, for example{% 标签 %}and most need corresponding end tags{% end标签 %}to specify the scope.

1. Conditional judgment: if/elif/else/endif

ifTags are the basis for implementing conditional logic. They can determine whether to render a section of content based on the truth value of an expression. For example, if an article has a thumbnail, we display it:

{% if archive.Thumb %}
    <img src="{{ archive.Thumb }}" alt="{{ archive.Title }}">
{% else %}
    <img src="{% system with name='DefaultThumb' %}" alt="默认缩略图">
{% endif %}

here,{% if archive.Thumb %}Will checkarchive.ThumbDoes exist or has a value. If true, the article thumbnail is displayed; otherwise,{% else %}a system default thumbnail is displayed. In addition,{% elif %}Can be used to handle multiple parallel conditions, making logical judgment more refined.

2. Loop traversal: for/empty/endfor

The website is filled with list data, such as article lists, product lists, navigation menus, and so on.forThe label is born to iterate over these data. It can access each item in the array, Slice, and other collections one by one, and make each item available within the loop.

Assuming we want to display a list of the latest articles:

{% archiveList archives with type="list" limit="10" %}
    {% for item in archives %}
        <li>
            <a href="{{ item.Link }}">{{ item.Title }}</a>
            <span>阅读量：{{ item.Views }}</span>
        </li>
    {% empty %}
        <p>当前没有任何文章发布。</p>
    {% endfor %}
{% endarchiveList %}

In this example,{% archiveList archives with type="list" limit="10" %}Is a control tag used to get a list of articles, which assigns the data of 10 articles obtained toarchivesVariable. Next,{% for item in archives %}The loop will iterate overarchivesEach article initem, then in<li>Display its link, title and reading count in the tag

It is worth mentioning,forLoop also supports some convenient properties and modifiers:

  • forloop.CounterGet the current loop index (starting from 1).
  • forloop.RevcounterGet the remaining number of times in the loop.
  • reversedReverse traverse the list.
  • sortedSort and traverse the list.
  • emptyWhen the loop collection is empty,{% empty %}and{% endfor %}the content between them will be rendered, very suitable for displaying a "no content" prompt.
  • cycleWhen alternating multiple values in the loop, for example{% cycle "even" "odd" %}You can output 'even' and 'odd' alternately in each loop, which is often used to add different CSS classes to list items.

3. Variable assignment:with/set

Temporarily defining some variables in the template can effectively improve the readability and reusability of the code.{% with %}Labels allow you to declare one or more variables within a block scope and{% endwith %}Use colon between

{% with pageTitle="安企CMS官网", pageKeywords="CMS,建站系统,Go语言" %}
    <title>{{ pageTitle }}</title>
    <meta name="keywords" content="{{ pageKeywords }}">
{% endwith %}

And{% set %}You can declare a variable at any position in the current template, its scope is usually wider, until the current template rendering ends.

4. Modularization and Inheritance:include/extends/block/macro

To enhance the reusability and maintainability of the template, AnQiCMS introduced the module