How to get and display the current page number in AnQiCMS template?

Navigate the beauty of pagination: Easily obtain the current page number in AnQiCMS templates

As an experienced website operations 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 the 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 result pages, etc., among which obtaining and displaying the current page number is a basic and core requirement.Today, let's delve deeply into how to elegantly obtain and display the current page number in the AnQiCMS templatepages.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 (through thearchiveListLabel), product list, or document list under the label (throughtagDataListLabel), when we need to implement pagination display, the key is to display these list labelstypethe parameter to"page"Once specified as"page", AnQiCMS will prepare a complete set of page context data for you in the background, which can be called by the front-end template.

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

The core of getting the current page number: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 you can use a custom variable name, here is the example of using the variable name)pagesFor the context variable. ThispagesA variable is a very powerful object that carries all the key information of the current pagination state. And the protagonist of today - the current page number, is stored inpagesthe object'sCurrentPagein the field.

To get and display the current page number, the operation is extremely concise and intuitive, you just need topaginationreference it within the tag, by using the double brace syntax:

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

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

Build a complete pagination navigation in practice

It is often not enough to just display the current page number, usually we will integrate it into the entire pagination navigation to provide a more comprehensive user experience. Now, let's see a more complete example, combining the current page number with the total number of pages, first page, last page, previous page, next page, and the list of middle page numbers:

{# 假设我们正在某个列表页，首先需要获取分页数据 #}
{% 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 withpages.TotalPagesto provide the context information of the current page. At the same time,pagesThe object also providesFirstPage/PrevPage/NextPage/LastPageAn object that can be directly referenced, as well as an array containing all the intermediate page numberspages.Pagesfor eachitemareLinkandIsCurrentAttribute, allowing us to easily implement dynamic highlighting of the current page number style. This way of providing structured data greatly simplifies the development of front-end pagination components.

Summary

AnQiCMS provides intuitive and powerful pagination support at the template level. ThrougharchiveList(or other list tags)配合type="page", then usepaginationtag to obtainpagesAn object, and we can easily obtain and display includingpages.CurrentPageAll pagination information within. This not only improves our development efficiency, but also ensures that the pagination experience of the website remains consistent and optimized across different content types.As an operator, mastering these template skills can make us more proficient in content management and website optimization.

Frequently Asked Questions (FAQ)

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

Answer: InpaginationInside the tag, you can directly access through{{pages.TotalPages}}Get the total number of pages and through{{pages.TotalItems}}This information is usually displayed with the current page number, providing users with a comprehensive pagination overview.

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

Answer: This situation usually occurs when the current page is not a pagination list page, or when the tag used to obtain the list (such asarchiveList/categoryList/tagDataList) is not set correctlytype="page"Parameter.pagesAn object is only initialized when the page data is explicitly requested. Please check if your list tag has settypeis set to"page"Make sure you are on a page that actually triggers pagination (for example, bylimitthe parameter limits the number of items displayed, resulting in multiple pages).

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

Answer:paginationTags providedshowParameter, 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" %}。“Furthermore，”pages.Pagesis an array containing all the intermediate page numbers, you can iterate through this array and combine it with each page item'sitem.IsCurrentTo determine if it is the current page, so that different CSS styles (such as highlighting) can be applied, realizing fully customizable page navigation styles.