Master the beauty of pagination: Easily get the current page number in AnQiCMS templates

As a senior website operation expert, I know that an efficient content management system is crucial for the vitality of a website.AnQiCMS with its high-performance architecture based on Go language and flexible template mechanism, has become the preferred choice for many small and medium-sized enterprises and content operation teams.In daily operations, we often need to display pagination information in scenarios such as list pages, search results pages, etc., where the acquisition and display of the current page number is a fundamental and core requirement.pages.CurrentPage.

Understand the pagination mechanism of AnQiCMS

In AnQiCMS, pagination is not just a simple list of numbers; it is a highly optimized feature closely integrated with the content list. Whether it is an article list (viaarchiveListLabel), product list, or document list under the label (via)tagDataListLabel), the key to implementing pagination display lies in these list labelstypeparameter settings"page". Once specified as"page"English, AnQiCMS will prepare a complete set of page context data in the background for your front-end template to call.

This page context data is exactly throughpaginationLabel appears in front of your template.paginationThe tag is designed by AnQiCMS specifically for handling pagination logic, it can not only generate pagination links, but also provide detailed information such as total number of pages, total number of entries, first page, last page, previous page, next page, and current page number.

Get the core of the current page:pages.CurrentPage

When you introduce and use the AnQiCMS templatepaginationWhen tagging, for example:

{% pagination pages with show="5" %}
    {# 在这里，'pages' 就是包含所有分页信息的对象 #}
{% endpagination %}

The system will create a namedpages(or a variable name you define, here usingpagescontext variable of (for example)pagesA variable is a very powerful object that carries all the key information of the current pagination state. And today's main character - the current page number, is stored inpagesObjects'CurrentPagefield in.

To get and display the current page number, the operation is simple and intuitive, you just need topaginationRefer to it within the tag by using double curly braces syntax:

当前页码：{{pages.CurrentPage}}

Is it not very simple? This line of code can directly output the current page number being visited on your web page. For example, if the user is browsing the second page, it will display '2'.

Actual Application: Build a complete pagination navigation

仅仅显示当前页码往往是不够的，通常我们会将它融入到整个分页导航中，提供更全面的用户体验。现在，让我们看一个更完整的示例，将当前页码与总页数、首页、末页、上一页、下一页以及中间页码列表结合起来：

{# 假设我们正在某个列表页，首先需要获取分页数据 #}
{% archiveList archives with type="page" limit="10" %}
    {# 这里是文章列表的循环内容，省略以便聚焦分页 #}
    {% for item in archives %}
        <div class="article-item">
            <h3><a href="{{item.Link}}">{{item.Title}}</a></h3>
            <p>{{item.Description}}</p>
        </div>
    {% endfor %}
{% endarchiveList %}

{# 接着，使用 pagination 标签构建分页导航 #}
<div class="pagination-container">
    {% pagination pages with show="5" %}
        <p class="pagination-summary">
            总共 <span>{{pages.TotalPages}}</span> 页，当前第 <span>{{pages.CurrentPage}}</span> 页
        </p>

        <ul class="pagination-list">
            {# 首页链接 #}
            <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 example, we can clearly seepages.CurrentPagehow it is related topages.TotalPagesto provide the context information of the current page. At the same time,pagesobject also providesFirstPage/PrevPage/NextPage/LastPagePages that can be directly referenced, as well as an array containing all the intermediate page numberspages.PagesEach,itemare all equipped withLinkandIsCurrentProperties, allowing us to easily implement the highlighting of the current page number style. This way of providing structured data greatly simplifies the development of front-end pagination components.

Summary

AnQiCMS in the template level provides an intuitive and powerful pagination support. ByarchiveList(or other list tags)配合type="page"，then make use ofpaginationtags to getpages对象，we can easily obtain and display includingpages.CurrentPageAll pagination information included.This not only improves our development efficiency, but also ensures that the pagination experience of the website remains consistent and optimized under different content types.As an operator, mastering these template skills will enable us to manage content and optimize the website more skillfully.

Common Questions (FAQ)

1. Question: How to get the total number of pages or total number of entries in AnQiCMS template?

Answer: Inpaginationtags inside, you can directly access through{{pages.TotalPages}}Get the total number of pages, as well as{{pages.TotalItems}}the total number of entries in the list. This information is usually displayed with the current page number, providing users with a comprehensive pagination overview.

2. Ask: I have used{{pages.CurrentPage}}in the template, but it did not display any content. What is the reason?

答：这种情况通常发生在当前页面不是一个分页列表页，或者用于获取列表的标签（如archiveList/categoryList/tagDataList）没有正确设置type="page"Parameter.pagesThe object will only be initialized when explicit pagination data is requested. Please check if your list label has settypeset"page"and ensure that you are on a page that actually triggers pagination (for example, bylimitthe parameter limits the number of displayed items, resulting in multiple pages of content).

3. Q: Besidespages.CurrentPageHow can I customize the pagination link display, for example, controlling the number of page numbers displayed in the middle?

Answer:paginationTags provideshowparameter, which you can use to control the number of page numbers displayed in the middle page number list, for example{% pagination pages with show="7" %}In addition,pages.Pagesis an array containing all intermediate page numbers, you can iterate through this array and combine with each page number item'sitem.IsCurrentProperty to determine whether it is the current page, thus applying different CSS styles (such as highlighting), to achieve fully customized page navigation styles.