Fine control: The practical guide to the number and sorting of the article list page of AnQi CMS

In content operation, the article list page of the website is an important window for users to browse content and discover information.A well-organized and content-ordered list page, which not only improves user experience but is also a key aspect of search engine optimization (SEO).Anqi CMS is well-versed in this, allowing you to easily and finely control the number of articles displayed per page and the sorting method of the content through its powerful and flexible template tag system.

This article will guide you in-depth on how to use the core template tags in AnQi CMS to achieve this goal, making your website content more attractive and logical.

The core tag reveals:archiveListIts powerful functions

In AnQi CMS, the call of all articles, products and other content data is inseparable from a core tag:archiveList. It is like your dedicated content manager, able to accurately filter and present the required articles according to your instructions.The core that controls the number of items displayed per page and the sorting method, and it is also achieved through different parameters of this tag.

Master the quantity:limitParameters and flexible pagination

To control how many articles are displayed per page on the list page,archiveListlabel'slimitis your preferred tool parameter.

If your list page does not require pagination and you just want to simply display a fixed number of articles, such as the 'Latest Articles' module on the homepage, you cantypethe parameter tolist，and cooperatelimitThe parameter specifies the number of items to display. For example, if you want to display the latest 5 articles:

{% archiveList archives with type="list" limit="5" %}
    {% for item in archives %}
        <li><a href="{{item.Link}}">{{item.Title}}</a></li>
    {% endfor %}
{% endarchiveList %}

For articles list pages that require pagination, such as all articles in a category, you need to settypethe parameter topage. At this point,limitThe parameter's role has become to define the 'number of articles displayed per page'. In order for the page to display the complete page number navigation, we need to introducepaginationTags:

{% archiveList archives with type="page" limit="10" %} {# 每页显示10篇文章 #}
    {% for item in archives %}
        <li>
            <a href="{{item.Link}}">
                <h5>{{item.Title}}</h5>
                <p>{{item.Description}}</p>
                <span>发布日期：{{stampToDate(item.CreatedTime, "2006-01-02")}}</span>
                <span>浏览量：{{item.Views}}</span>
            </a>
        </li>
    {% endfor %}
{% endarchiveList %}

{# 分页导航 #}
<div class="pagination">
    {% pagination pages with show="5" %} {# 最多显示5个页码按钮 #}
        <ul>
            <li class="{% if pages.FirstPage.IsCurrent %}active{% endif %}"><a href="{{pages.FirstPage.Link}}">首页</a></li>
            {% if pages.PrevPage %}
                <li><a href="{{pages.PrevPage.Link}}">上一页</a></li>
            {% endif %}
            {% for item in pages.Pages %}
                <li class="{% if item.IsCurrent %}active{% endif %}"><a href="{{item.Link}}">{{item.Name}}</a></li>
            {% endfor %}
            {% if pages.NextPage %}
                <li><a href="{{pages.NextPage.Link}}">下一页</a></li>
            {% endif %}
            <li class="{% if pages.LastPage.IsCurrent %}active{% endif %}"><a href="{{pages.LastPage.Link}}">尾页</a></li>
        </ul>
    {% endpagination %}
</div>

In this code block,archiveListBylimit="10"Tell the system to display 10 articles per page, andpaginationTags are responsible for generating navigation links such as 'Home', 'Previous Page', '1, 2, 3...', 'Next Page', 'End Page' based on the current page number and total number of articles, allowing users to freely switch between different pages.show="5"The parameter controls the maximum display quantity of the middle page number button.

Define order:orderMultiple parameter options

The way articles are sorted directly affects the presentation logic of the content and the reading habits of users. Anqi CMS'sarchiveListtags provide flexibleorderParameters, allowing you to sort articles according to different logic based on your actual needs.

Common sorting methods include:

  • Latest release:This is usually the default sorting method of the website, articles are sorted byid descDisplay in reverse order by ID, i.e., in reverse chronological order, with the most recently published articles at the top.
  • Hot articles:Sorted based on the number of article viewsviewsFor example,order="views desc"The article with the highest view count will be displayed first.
  • Custom sorting in the background:If you wish to manually adjust the order of the articles, you can set a "display order" value while editing the articles in the background, then useorder="sort desc"Call it. The smaller the number, the earlier it is usually (depending on the backend settings).
  • Mixed sorting:You can also combine multiple sorting rules, for exampleorder="flag desc|views desc"It will first be sorted by recommended attribute (flag), and then sorted by views in case of the same recommended attribute.

The following is an example of an article list sorted by views in descending order:

{% archiveList hotArchives with type="list" limit="8" order="views desc" %} {# 获取浏览量最高的8篇文章 #}
    <h3>热门文章</h3>
    <ul>
        {% for item in hotArchives %}
            <li><a href="{{item.Link}}">{{item.Title}} - {{item.Views}}次浏览</a></li>
        {% endfor %}
    </ul>
{% endarchiveList %}

Comprehensive application: making content display more accurate

exceptlimitandorderparameter,archiveListTags support multiple filtering conditions, allowing you to more accurately control the content displayed on the list page:

  • categoryId:Specify the category ID of the article. For example:categoryId="1"Only display articles under the category with ID 1.
  • moduleId:Specify the model ID of the article. For examplemoduleId="1"Only display the content under the "Article Model", whilemoduleId="2"then display the content under the "Product Model".
  • flag:Filter according to the recommended attributes of the article (such as “Top[h]”, “Recommended[c]”, etc.). For exampleflag="h"Only display articles marked as Top.”
  • q:In the search results page, throughqThe parameter can match the content of the article title that includes specific keywords.

By flexibly combining these parameters, you can build various complex and logical article list pages, whether it is by category, by tag, or combined with popular, recommended, and other attributes, it can be realized in Anqi CMS.

Practice case: Step-by-step configuration of the list page

  1. Confirm the template file:First, find the template file corresponding to the list page you want to modify. Usually, the naming convention of the template for the article category list page might be{模型table}/list.htmlor{模型table}/list-{分类ID}.html.
  2. WritingarchiveListTags:In the template, usearchiveListTag to retrieve article data and set according to requirementstypeWithpageandlimitParameters to define the number of items per page