In Anqi CMS, whether it is to display the detailed content of a single article or to preview multiple articles on the list page, flexibly obtaining and displaying the title, detailed content, summary, and recommended attributes of the articles is the foundation of website operation.The design of Anqi CMS makes this process intuitive and efficient, we mainly achieve it through the use of template tags and variable calls.

Firstly, understanding the template system of Anqi CMS is crucial. It adopts syntax similar to Django's template engine, which means you will mainly use double curly braces{{变量}}To display data, as well as single curly braces and percentages{% 标签 %}To perform logical judgments or call specific functions

To retrieve and display detailed information of a single article

When you visit a specific article page, it usually needs to display its full title, detailed content, concise introduction, and possibly recommended attributes. Anqi CMS provides a named attribute for the article on the current page.archiveThe global variable, you can directly use it to access the various fields of the article.

1. Article Title (Title)

The article title is the soul of the content, you can easily obtain and display it in the detail page:

<h1>{{archive.Title}}</h1>

If your template needs to obtain the title of an article with a specified ID, you can usearchiveDetailLabel, and pass in the article ID:

{# 获取ID为10的文章标题 #}
<h2>{% archiveDetail with name="Title" id="10" %}</h2>

2. Detailed content (Content)

The core content of the article is an important part of the detailed information. Anqi CMS'sarchive.ContentThe field contains the full content of the article, which may include HTML tags or Markdown formatted text. To ensure that the HTML content is rendered correctly rather than displayed as plain text, you need to use|safeFilter. If the content is in Markdown format, the Anqicms will automatically convert it to HTML: 

<div class="article-content">
    {{archive.Content|safe}}
</div>

If you wish to obtain the detailed content of an article with a specified ID, you can also usearchiveDetailTags:

{# 获取ID为10的文章详细内容，并正确渲染HTML #}
<div class="other-article-content">
    {% archiveDetail articleContent with name="Content" id="10" %}
    {{articleContent|safe}}
</div>

3. Article Summary (Description)

The article summary is a brief overview of the content, usually used for SEO optimization or as a quick preview on the detail page.AnQi CMS will output the profile you fill in the background directly.If you do not manually fill in the summary when publishing an article, the system will automatically extract the first 150 characters of the article content as a summary.

<p class="article-description">
    {{archive.Description}}
</p>

Similarly, get the summary for the specified article ID:

{# 获取ID为10的文章简介 #}
<p class="other-article-description">
    {% archiveDetail with name="Description" id="10" %}
</p>

4. Recommended attribute (Flag)

The AnQi CMS allows you to set various recommended attributes for articles, such as headline, recommendation, slideshow, etc., which are identified by a single letter (for examplehrepresenting the headline,cto represent recommendation). In the article detail page,{{archive.Flag}}These property letters will be directly displayed.

<p class="article-flags">推荐属性：{{archive.Flag}}</p>

These property letters can be used for conditional judgments in templates, for example, to determine if an article is set as a headline:

{% if archive.Flag | contain: "h" %}
    <span class="flag-headline">头条</span>
{% endif %}

Get and display the information in the article list

On category pages, homepages, or other list pages, you may need to display the brief information of multiple articles, including titles, summaries, recommended attributes, as well as article links and thumbnails, etc. At this time,archiveListthe label comes into play.

1. Obtain and iterate through the article list

archiveListThe tag is used to retrieve a list of articles, you can set different filtering conditions as needed, such as category ID, display quantity, sorting method, etc. The retrieved list of articles is an array object, which needs to be accessed throughforto iterate in a loop.

{% archiveList archives with type="list" limit="10" categoryId="1" %}
    {% for item in archives %}
        <div class="article-item">
            {# 这里将显示每篇文章的标题、简介、推荐属性等 #}
        </div>
    {% endfor %}
{% endarchiveList %}

In the above code,type="list"represents getting a normal list,limit="10"limits displaying 10 articles,categoryId="1"then specifies the category ID of the article.archivesis the variable name you defined, representing the list of articles obtained.

2. Display the article title and link in the list

In the list loop,item.TitleUsed to display the title of each article,item.LinkThen provided the access link to the article:

<h3><a href="{{item.Link}}">{{item.Title}}</a></h3>

3. Display the article summary in the list

In the article list, we usually display the summary rather than the detailed content to provide a quick preview:

<p class="item-description">{{item.Description}}</p>

4. Recommended properties in the list

The recommended attribute is usually used in two ways on the list page: one is for filtering articles, and the other is to display a small icon or mark next to the article.

  • Filter the recommended articles in the list:If you only want to display articles set to the "recommended" attribute, you canarchiveListthe tag withflag="c"parameter (assumedcrepresent recommended). Please note that each time the callarchiveListWhen labeling, only one recommended attribute should be used for filtering.

    ”`twig {# Only display the list of articles set to the "recommended" attribute #} {% archiveList recommendedArticles with type=“list” limit=“5” flag=“c” %}

    {% for item in recommendedArticles %}
    <div class="recommended-