AnQiCMS document list pagination and custom page number: Make your content management more efficient

Imagine when your website content becomes increasingly rich, with thousands of articles, products, or news lists neatly arranged. If it cannot be organized and displayed effectively, users may feel at a loss.A good pagination mechanism can not only improve user experience and help visitors quickly find the information they need, but it is also an important part of SEO optimization.AnQiCMS, as an efficient content management system, fully understands the importance of this need and therefore provides a very flexible and easy-to-implement document list pagination feature, which supports customizing the number of items displayed per page and the style of pagination navigation, giving a powerful boost to your content management work.

Master the core of pagination easilyarchiveListWithpaginationtags

In AnQiCMS, the pagination display of document lists is mainly dependent on two powerful template tags:archiveListandpagination. We canarchiveListUnderstood as a data extraction expert, it is responsible for fetching document data from the database as needed; whilepaginationis the architect of page navigation, it determinesarchiveListProvide the data to build the pagination links bar visible at the bottom of your website.

To implement pagination, we need to clarify two points first:

  1. How many documents per page?This is controlled byarchiveListTagslimitparameters.
  2. How many page numbers can be displayed on the pagination navigation bar?This is controlled bypaginationTagsshowparameters.

After understanding these two core concepts, we can start implementing pagination of document lists in AnQiCMS templates.

Implement the steps for document list pagination.

Typically, we will be in{模型table}/list.html[for example]article/list.htmlorproduct/list.html),search/index.htmlortag/list.htmlsuch a list page template to set the pagination logic.

Step 1: UsearchiveListGet pagination data and define the number of items per page

Firstly, you need to usearchiveListtags to retrieve document data. The key point is to settype="page"Parameter, this tells the system that you want the data returned in a paginated form, rather than a simple list. At the same time,limitParameters, you can easily control how many documents are displayed per page. For example, if you want to display 10 documents per page, you can set it like this: 

{% archiveList archives with type="page" limit="10" %}
    {% for item in archives %}
        <!-- 在这里展示每篇文档的标题、链接、简介等信息 -->
        <h3><a href="{{item.Link}}">{{item.Title}}</a></h3>
        <p>{{item.Description}}</p>
        <!-- 更多文档字段 -->
    {% empty %}
        <p>当前分类或搜索条件下没有找到任何文档。</p>
    {% endfor %}
{% endarchiveList %}

In this code,archivesis an array object containing all documents on the current page. You can use{% for item in archives %}to loop through and display the detailed information of each document.limit="10"Explicitly tell AnQiCMS, only 10 documents are displayed per page.

archiveListTags also support other parameters for fine-grained control of data range, such asmoduleId(Filtered by model ID),categoryId(Filter by category ID)、order(Sort method, such as)order="views desc"Descending by views) as well asq(Search keywords) etc., making your content filtering more flexible.

Step 2: UsepaginationBuild pagination navigation and customize the number of page numbers

After obtaining the pagination data, the next step is to build the pagination navigation bar at the bottom of the page, allowing users to click through pages. This requires usingpagination标签。这个标签会自动根据archiveList获取到的数据，计算出总页数、当前页、首页、末页、上一页和下一页等信息，并生成相应的导航链接。

The most convenient way is that you canshowDefine the maximum number of page number links displayed on the pagination navigation bar using parameters. For example,show="5"，will display up to 5 page number links near the current page, which helps to maintain the simplicity of pagination navigation, especially when the total number of pages is very large.

The following is a common pagination navigation example:

<div class="pagination">
    {% pagination pages with show="5" %}
    <ul>
        <!-- 显示总条数和总页数，帮助用户了解整体内容量 -->
        <li>总数：{{pages.TotalItems}}条，总共：{{pages.TotalPages}}页，当前第{{pages.CurrentPage}}页</li>

        <!-- 首页链接 -->
        <li class="page-item {% if pages.FirstPage.IsCurrent %}active{% endif %}">
            <a href="{{pages.FirstPage.Link}}">{{pages.FirstPage.Name}}</a>
        </li>

        <!-- 上一页链接 -->
        {% if pages.PrevPage %}
            <li class="page-item"><a href="{{pages.PrevPage.Link}}">{{pages.PrevPage.Name}}</a></li>
        {% endif %}

        <!-- 中间页码链接列表 -->
        {% for item in pages.Pages %}
            <li class="page-item {% if item.IsCurrent %}active{% endif %}">
                <a href="{{item.Link}}">{{item.Name}}</a>
            </li>
        {% endfor %}

        <!-- 下一页链接 -->
        {% if pages.NextPage %}
            <li class="page-item"><a href="{{pages.NextPage.Link}}">{{pages.NextPage.Name}}</a></li>
        {% endif %}

        <!-- 末页链接 -->
        <li class="page-item {% if pages.LastPage.IsCurrent %}active{% endif %}">
            <a href="{{pages.LastPage.Link}}">{{pages.LastPage.Name}}</a>
        </li>
    </ul>
    {% endpagination %}
</div>

In this code,pagesYespaginationThe pagination information object provided by the tag. It includes:TotalItems(total number of entries),TotalPages(Total number of pages),CurrentPage(Current page) andFirstPage/PrevPage/NextPage/LastPageetc. Each page object contains:Name("link text"),Link(link URL) andIsCurrent(Is it the current page) and other properties. By loopingpages.Pages, you can display the link of the middle page number and use{% if item.IsCurrent %}Determine the current page and add different styles to it to provide better visual feedback.

Apply flexible usage of advanced techniques

AnQiCMS's pagination feature is not isolated; it can be seamlessly integrated with the website's search and filter functions. When users enter keywords into the search box or filter content through the filtering conditions,archiveListTags will automatically identify URLs inqThe search keyword or other custom filtering parameters, and keep these conditions when pagination, to ensure that users always see the content that matches their filtering criteria when flipping pages.

If you manage multiple sites and want to call the content list of another site within one site and perform pagination,archiveListTagssiteIdthe parameter can be used. By specifyingsiteId，You can call content across sites, providing great convenience for multi-site operations.

AnQiCMS in the implementation of document list pagination fully considers practicality and flexibility.By simple tag combinations, it can meet the needs from basic pagination to complex content display.It not only helps us efficiently organize and present massive amounts of content, but also makes secondary development and customization easy and pleasant with clear template syntax.

Common Questions and Answers (FAQ)

1. Why did I setlimitparameters, but the number of page numbers displayed on the pagination navigation bar did not change?

limitThe parameter controls isHow many documents to display per page(i.e., the number of items per page), andpaginationTags withinshowThe parameter controls isThe maximum number of page number links displayed on the pagination navigation bar.These two parameters are independent, working together to define the complete user pagination experience.showthe value of the parameter.

2. Can I use multiple pagination lists on the same page? For example, a list of articles above and a list of products below on the same page, both with pagination?

Yes, AnQiCMS supports implementing multiple independent pagination lists on the same page. The key is to assign different variable names for each.archiveListtags and their corresponding.paginationTag usagedifferent variable names.For example, you can.