Efficiently display article lists in AnQiCMS, supporting various sorting, filtering, and pagination methods, which is the core link of content management.Understanding the flexible application of template tags can help you build highly customized and user-friendly content display pages.

To achieve this goal, we mainly rely on the powerful template tag system of AnQiCMS, especially the core ofarchiveListtagscoordinated withpaginationtagsas well as various auxiliary filters and logical controls.

One, Core:archiveListUse of tags

archiveListTags are the foundation for retrieving and displaying lists of articles (or other content models). It acts like a data query tool, capable of extracting articles from the database based on the conditions you set.

In the template, you can use it like this:)

{% archiveList archives with type="list" limit="10" %}
    {# 在这里循环展示每篇文章的详细信息 #}
{% endarchiveList %}

Here,archivesIt is a custom variable name used to store the retrieved list of articles.type="list"The list represents a fixed number of articles obtained.limit="10"It limits to only displaying the latest 10 articles.

In{% for item in archives %}In such a loop,itemthe variable will contain various information about each article, such asitem.Title(Title),item.Link(Link),item.Description[Summary],item.Views(View count) anditem.CreatedTime(Publish time) etc. These fields can be flexibly used to build the display content of the list.

Secondly, the flexible display of the article list is realized

It is not enough to simply display a fixed number of article lists; we need to be able to sort and filter articles according to user needs or operational strategies.

1. Smart Sorting

archiveListTags provideorderParameters, allowing you to easily control the order of articles.

  • Sorted by publish time:By default, articles are usually sorted in descending order by ID (i.e., the most recently published), and you can explicitly specifyorder="id desc".
  • Sort by views:If you want to display popular articles, you can set it to:order="views desc".
  • Sort by custom sorting in background:Some content may require manual sorting, AnQiCMS supports:order="sort desc".

For example, to display the top 10 articles with the highest views:

{% archiveList archives with type="list" limit="10" order="views desc" %}
    {# 循环展示文章 #}
{% endarchiveList %}

2. Rich filtering options

The filter function is the key to personalized content display. AnQiCMS provides multiple filtering methods.

  • Filter based on categories and attributes:You can usecategoryIdParameters to display articles under specific categories, for examplecategoryId="1"If the article is assigned a recommendation attribute (such as headline [h], recommendation [c], etc.), it can be filtered through parameters. If you want to exclude certain categories or attributes, you can also useflag="c"excludeCategoryIdandexcludeFlagParameter.

    For example, display the article model (moduleId="1") all recommended articles under the category with ID 5:

    {% archiveList articles with moduleId="1" categoryId="5" flag="c" type="list" %}
        {# 循环展示推荐文章 #}
    {% endarchiveList %}
    
  • Full-text search filtering:For the search keywords entered by the user,archiveListofqParameters can be useful. Typically, search pages will pass user input keywords through URL parametersqPassing,archiveListwill automatically capture and match according to the article title.

    For example, the search results page:

    {% archiveList searchResults with type="page" q=urlParams.q %}
        {# 循环展示搜索结果 #}
    {% endarchiveList %}
    

    (urlParams.qwill automatically get the URL:?q=关键词of关键词(part)

  • Advanced custom parameter filtering:One of the most powerful filtering features of AnQiCMS is the support for filtering based on custom fields of the content model.This is very useful for building vertical domain websites (such as real estate, recruitment, commodities).You can add custom fields such as 'Apartment Type', 'Salary Range', 'Brand', etc. to the content model in the background and set them as filterable.

    To achieve this filtering, we need to use:archiveFiltersTags are used to generate filtering conditions, thenarchiveListit will automatically respond to these conditions.archiveFiltersTags will return a list containing each filtering dimension and its available options, and it will automatically mark the selected filtering options based on the current URL parameters.

    For example, on a real estate website, you can filter by 'type' and 'area':

    {# 生成筛选条件 #}
    {% archiveFilters filters with moduleId="1" allText="不限" %}
        {% for item in filters %}
        <div>
            <span>{{item.Name}}: </span>
            {% for val in item.Items %}
            <a href="{{val.Link}}" class="{% if val.IsCurrent %}active{% endif %}">{{val.Label}}</a>
            {% endfor %}
        </div>
        {% endfor %}
    {% endarchiveFilters %}
    
    
    {# 结合筛选条件展示文章列表,archiveList会自动识别URL中的筛选参数 #}
    {% archiveList properties with type="page" moduleId="1" %}
        {# 循环展示房产列表 #}
    {% endarchiveList %}
    

    When the user clicks on the filter criteria, the URL will automatically carry the corresponding parameters (such as?huxing=三室一厅&quyu=朝阳区)archiveListWill dynamically adjust the query results based on these parameters.

3. Accurate control of pagination display

For websites with a large number of articles, pagination is an essential feature.AnQiCMS decouples the acquisition of article list data and the generation of pagination links, providing a clear implementation path.

To enable pagination, first inarchiveListput in the tagtypeparameter settings"page":

{% archiveList articles with type="page" limit="10" %}
    {# 循环展示当前页的文章 #}
{% endarchiveList %}

limit="10"Here it represents displaying 10 articles per page.

Next, usingpaginationtagsRender pagination links:

{% pagination pages with show="5" %}
    <a href="{{pages.FirstPage.Link}}">首页</a>
    {% if pages.PrevPage %}
    <a href="{{pages.PrevPage.Link}}">上一页</a>
    {% endif %}
    {% for item in pages.Pages %}
    <a href="{{item.Link}}" class="{% if item.IsCurrent %}active{% endif %}">{{item.Name}}</a>
    {% endfor %}
    {% if pages.NextPage %}
    <a href="{{pages.NextPage.Link}}">下一页</a>
    {% endif %}
    <a href="{{pages.LastPage.Link}}">末页</a>
{% endpagination %}

paginationTags will generate apagesobject that includes information such as the current page, total number of pages, first page, last page, previous page, next page, and the list of middle page numbers.show="5"The parameter controls the maximum number of middle page links displayed. Through the looppages.PagesYou can build common pagination navigation.

Four, combine other tags to enhance the dimension of list information

To make the article list more rich and practical, we often need to integrate other information.

  • Display article classification information:In the list of articles, in addition to the article title, it is usually necessary to display its category. Althoughitem.CategoryIdCategory ID is provided, but to get the category name and link, you can usecategoryDetailtags:

    <span>所属分类:{% categoryDetail with name="Title" id=item.CategoryId %}</span>
    
  • Format time and date:The publishing time of an article is usually in timestamp format, to make it easier to read, you can usestampToDateFilterto format:

    <span>发布时间:{{stampToDate(item.CreatedTime, "2006-01-02")}}</span>
    

    The '2006-01-02' is the Go language's standard time formatting, representing 'Year-Month-Day'.

  • Display article tags:If the article is associated with tags, you can usetagListtagsto retrieve and display:

    {% tagList tags with itemId=item.Id %}
        {% for tag in tags %}
        <a href="{{tag.Link}}">{{tag.Title}}</a>
        {% endfor %}
    {% endtagList %}
    
  • Access custom fields:When the content model defines additional custom fields,archiveParamsTag or directly through `item.customFieldName`