AnQiCMS provides a powerful and flexible template system, allowing for highly customizable display of website content.The template tag syntax draws inspiration from the Django template engine and combines the ease of use of Blade templates, making it easy for even users unfamiliar with the Go language to get started quickly.However, to fully harness the potential of template tags and avoid common mistakes, understanding their correct usage and potential pitfalls is crucial.

Basic AnQiCMS template tags: Understanding core syntax and conventions

AnQiCMS template files are usually named with.htmlsuffix, stored in/templatedirectory. The core syntax for handling data output and logic control in templates is double curly braces{{变量}}and single curly braces with the percent sign{% 标签 %}.

  • Data Output ({{变量}}): is used to directly display data, for example{{archive.Title}}It will output the title of the article. Variable names usually follow camelCase naming conventions (first letter capitalized), for exampleId/Title/CreatedTimeetc.
  • Logical control ({% 标签 %})Used to implement conditional judgment, loop traversal, file inclusion, and other functions. These tags must appear in pairs, with a start tag and an end tag, for example{% if 条件 %}...{% endif %}or{% for item in 列表 %}...{% endfor %}.

In actual use, template files are also used in conjunction with/public/static/The directory stores static resources such as CSS, JavaScript, images, etc.In order to ensure that the template can be correctly parsed, all template files should be saved using UTF-8 encoding.

AnQiCMS supports some default template file naming conventions, such as document lists can be named{模型table}/list-{分类id}.html, and single pages can be namedpage/{单页面id}.htmlUnderstanding these conventions can help us better organize template files and achieve personalized display of specific page content.

Key strategies to avoid common errors

To correctly use AnQiCMS template tags and avoid common issues, the following aspects are especially worth paying attention to:

  1. Case sensitivity is strictly required【en】AnQiCMS template tags and variable names are very sensitive to case. For example,{{archive.id}}and{{archive.Id}}are two different variables. The tag names such asarchiveListandarchivelistAlso, do not mix them. A small spelling error can cause the label to be unrecognizable or the data to not display normally.
  2. Proper closing of tags: All logical control tags (such as{% if %}/{% for %}/{% archiveList %}All of them must have corresponding end tags.{% endif %}/{% endfor %}/{% endarchiveList %}Forgetting to close the tags is a common mistake among beginners, which can cause template parsing errors or even page crashes.
  3. Accurate passing of parameters.Many tags need to specify parameters to determine which data to retrieve or how to process. For example,{% archiveDetail with name="Title" id="1" %}in,nameParameters specify the fields to be retrieved.idSpecify the ID of the article. The parameters supported by different tags may vary. Be sure to consult the relevant documentation to ensure the correctness of parameter names and value ranges. Pay special attention tomoduleId/categoryId/type/limitThe usage of commonly used parameters.
  4. The shift from old to new tags.: AnQiCMS inv2.1.1version has reconstructed the template tags, removing the originalarticleandproducttags, and newly addedarchiveLabels mean that, if your website is upgraded from an older version or follows the old tutorial, it still usesarticleListorproductDetailthese labels, it will cause an error. Make sure to use the newarchiveList/archiveDetailuniform labels.archiveSeries tags.
  5. Matching data type and filter.: Sometimes, data needs to be formatted or processed when outputting data.
    • Timestamp conversion.:CreatedTimeandUpdatedTimefields usually return Unix timestamp, need to usestampToDatelabel to format it as a readable date, for example{{stampToDate(item.CreatedTime, "2006-01-02 15:04")}}.
    • Safe output of HTML content: Article details (archive.Content) Category Content (category.ContentFields may contain HTML tags.The output will be automatically escaped to prevent XSS attacks, causing the HTML code to be displayed as plain text.|safeFilter, for example{{archive.Content|safe}}.
    • Markdown Content RenderingIf the content is written in Markdown, it will be automatically converted after enabling the Markdown editor. To manually control the conversion, you can addrenderParameter, or use|renderFilter, for example{{archive.Content|render|safe}}.
    • Content truncation: For overly long text, you can use|truncatechars:100(character truncation) or|truncatewords:50(word truncation) and other filters to truncate and add ellipses.
  6. Understanding of context dependency：Some tags (such asarchiveDetail/categoryDetail) without explicit specificationidortokenwill try to automatically obtain the context data of the current page. Used in document detail pagesarchiveDetailIt will automatically retrieve the current document data, but when used on the homepage, it needs to be explicitly specified.idparameters to retrieve specific document data.
  7. Correctly refer to static resource and template pathsIn templates, when referencing static resources (images, CSS, JS), it should use{% system with name="TemplateUrl" %}the tag to get the root path of the static resources of the current template, for example<link href="{% system with name="TemplateUrl" %}/css/style.css" rel="stylesheet">.includeOther template fragments also require a relative path to be correct, for example,{% include "partial/header.html" %}.

Practical Guide: The correct way to open commonly used tags

AnQiCMS provides rich tags. The following lists some common tag usage methods and points out the places that need attention:.

  • Global information acquisition (system,contact,tdk):

    • {% system with name="SiteName" %}Get the website name. This tag usually does not require any.endTag, output the result directly.
    • {% contact with name="Cellphone" %}Get the contact phone number. You can customize the name for easy calling, such as{% contact myPhone with name="Cellphone" %}{{myPhone}}.
    • {% tdk with name="Title" siteName=true %}Get the page title and you can choose whether to add the website name.siteNameThe parameter only applies toTitletake effect.

  • Content list and details (archiveList,archiveDetail,categoryList,categoryDetail,pageList,pageDetail):

    • Article/Product list:{% archiveList archives with moduleId="1" type="page" limit="10" %}
      • moduleIdSpecify the content model ID (such as1for articles,2for products). This is an important filtering condition.
      • type: Can belist(fixed quantity list) orpage(paged list).
      • limitLimit the display quantity.type="page"Must be used with.{% pagination %}Use the label.
      • categoryIdSpecify the category ID. Multiple IDs are separated by commas.
      • Use in the loop body,fortag to iterate overarchivesThrough{{item.Title}}/{{item.Link}}Wait to get the field.
    • Article/Product Details