As an Anqi CMS user, we all hope to efficiently and flexibly control the presentation of website content.Auto CMS does a great job in this aspect, providing a set of intuitive and powerful template engine syntax that allows us to easily achieve diverse content display needs.

English CMS template engine basics: Django style, easy to learn and use

In the template files of AnQi CMS, there are two main syntax structures:

  1. Variable output:{{ 变量名 }}This is the most common usage, used to display dynamic data on the page. For example, if you want to show the title of an article on the web page, you just need to write it in the template.{{ archive.Title }}The content inside double curly braces is the data variable to be displayed, which the system will automatically replace with the actual content. This method is straightforward and makes data presentation extremely simple.

  2. Logic control and tag:{% 标签名 参数 %}and{% 结束标签 %}When we need to implement more complex logic such as conditional judgments, loop traversals, and data retrieval in templates, we will use the label syntax composed of single curly braces and percent signs. These tags usually appear in pairs with clear start and end marks, for example{% if 条件 %}...{% endif %}Used for conditional judgment,{% for item in 列表 %}...{% endfor %}Used for looping to output list data. This structure clearly defines the logical scope of action, effectively avoiding confusion.

Powerful built-in tags: retrieve various content and functions

The CMS built-in a series of rich tags, which are the core tools for dynamic content display.They can help us retrieve various data such as system settings, article lists, category information, and even user comments from the database, and display them according to the rules we set.

For example, when you need to display the latest article list on the homepage,{% archiveList archives with type="list" limit="10" %}tags can help you dynamically retrieve and display this content. If you want to build a website navigation menu,{% navList navs %}The label can conveniently pull the navigation data configured by the backend. In the article detail page,{% archiveDetail with name="Content" %}you can easily pull out the main content of the article.

It is worth mentioning that these tags often support rich parameters, such ascategoryId(Category ID),moduleId(Model ID),order(sort method),limit(Display Quantity) and so on, allowing us to accurately control the source and presentation rules of the data. In addition,{% with 变量名="值" %}The label also allows you to temporarily define variables in the template, which is very useful when passing data toincludeauxiliary labels, helping to keep the code neat and modular.

For the display of dates and times, A safe CMS also provides convenient tools.{{ stampToDate(时间戳, "格式") }}This function allows you to beautify the timestamp data stored in the database according to any date-time format you need (such as "2006-01-02 15:04"), without the need for manual conversion.

Flexible filter: beautify and process data

In addition to direct output and logical control, the Anqi CMS template engine also provides a 'filter' feature, allowing you to fine-tune and beautify the data before it is finally displayed. Filters are used to|Symbols can be used after variables, allowing for chained usage, which is very flexible.

The following are some commonly used filters and their purposes:

  • |safeWhen you need to display content containing HTML tags (such as article text) without having these tags escaped,|safeFilter is your first choice. It tells the browser that this part of the content is safe and can be parsed directly as HTML.
  • |truncatechars:数字or|truncatewords:数字: These two filters are commonly used to truncate overly long text and add an ellipsis at the end.The former truncates by character count, and the latter by word count, which is very suitable for displaying brief content in lists or summaries.
  • |default:"默认值": When a variable may be empty or not exist, you can use|defaultThe filter provides a fallback value to avoid blank pages or error messages.
  • |join:"分隔符"and|split:"分隔符":|joinUsed to concatenate array elements into a string with a specified delimiter.|splitIt can split a string into an array by a delimiter, which is very useful when dealing with list data like tags, keywords, etc.
  • |date:"格式": AndstampToDateis similar,|dateFilters can be used totime.TimeThe date object of type is formatted into a specified string, following the Go language's time formatting rules.

Auxiliary label: Build modular and reusable templates

To improve the maintainability and reusability of the template, AnQi CMS introduces several auxiliary tags to encourage modular development:

  • {% include "模板文件" %}: Allows you to embed the content of a template file (such as header, footer, or sidebar) into another template, avoiding repetitive code writing.
  • {% extends "基础模板" %}and{% block 名称 %}: This is a powerful template inheritance mechanism. You can create a “base template” that includes a common page structure (such as header, footer, sidebar), and then other pages through{% extends %}Inherit it. Through{% block %}Define areas that can be overridden, so that child templates can rewrite these areas to achieve customized local content while maintaining overall consistency.
  • {% macro 名称(参数) %}: Macro (Function) is similar to a function, which allows you to define reusable code snippets.Macros can accept parameters and can be used in templates like a function call, greatly enhancing code reusability.
  • {% lorem %}: In the early stages of template development, if real data is lacking,{% lorem %}tags can quickly generate placeholder text to help you adjust the page layout and style.
  • {%-and-%}: These special markers are used to control the whitespace characters during template rendering.Through adding hyphens on both sides of the label, you can eliminate the extra line breaks or spaces generated by the label itself and its surroundings, making the generated HTML code more compact.

Summary

The template engine syntax design of AnQi CMS is clever, balancing flexibility and ease of use.Whether it is a simple content display, complex logic control, or efficient modular development, it provides a comprehensive and intuitive solution.Familiarize yourself with these syntaxes and tags, which will greatly enhance your efficiency in website content operation and page customization on the AnQi CMS, allowing your website content to be presented to users in the most expected form.

Common Questions (FAQ)

1. I used it in the template{{ 变量 }}or{% 标签 %}It does not display any content, or it displays an error message, why is that?

There are usually several possible reasons for this situation:

  • The variable name or tag name is spelled incorrectly:The template engine of AnQi CMS is case-sensitive, please carefully check if the variable name or label name is consistent with the one in the document or the backend. For example,{{ Archive.Title }}and{{ archive.title }}it may point to different data.
  • Data has not been passed to the template:Some variables or list data need to be explicitly passed to the template from the backend logic to be used.If you are customizing the template, please make sure that the relevant data has been correctly passed from the backend controller.
  • The variable value is empty:Even if the variable name is correct, if the variable has no value in the current context, it may also display blank during template rendering. You can try using|default:"备用内容"The filter provides a default value to facilitate debugging and user experience.
  • The tag usage is incorrect:Especially logical control tags (such asifandforThey usually need to appear in pairs and the parameter format must be correct. For example,forThere must be something after the loop.{% endfor %}.

2. I want to display article content in the template, but HTML tags (like<b>/<p>) are displayed as text instead of being parsed by the browser, what should I do?

This is the result of HTML escaping all output content for security reasons by default, which is intended to prevent cross-site scripting (XSS) attacks. If you are sure that the content to be displayed is safe and you want the browser to parse it as HTML, you can use|safeFilter. For example, to{{ archive.Content }}Change to{{ archive.Content|safe }}Please ensure that the content source is reliable to avoid introducing security risks.

3. How to use different template layouts on different pages, for example, some pages need sidebars while others do not?

AnQi CMS supports template inheritance and custom template files.

  • Template Inheritance:You can create a name forbase.htmlEnglish's basic template, defines the general structure of the website (such as header, footer), and uses{% block 内容区域 %}{% endblock %}to mark the variable areas. Then, your other page templates (such asindex.html/detail.html) to the same port of the AnQiCMS application instance (the default is usually{% extends "base.html" %}Inherit it and only rewrite (override) thoseblockarea to define its unique content, thus achieving different layouts.
  • Custom template file:For specific content models (such as articles, categories, single pages), Safe CMS allows you to specify different template files to be used in the backend. For example, setting a template file for the "About Us" single page.page/about.htmlAs its exclusive template