在管理网站内容时，无论是文章列表、产品展示还是其他分类页面，一个清晰有效的分页导航对于提升用户体验和搜索引擎优化都至关重要。安企CMS（AnQiCMS）提供了强大的模板标签功能，让我们可以轻松地为列表页面添加正确的分页导航。本文将详细介绍如何在安企CMS中实现这一功能。

理解 AnqiCMS 中的分页机制

安企CMS通过一套直观的模板标签来处理内容展示和分页。核心在于两个标签的配合使用：内容列表标签（如archiveList或tagDataList）负责查询和准备需要分页的数据，而pagination标签则负责生成具体的分页导航链接。

要让内容列表能够分页，首先需要在使用 archiveList 或 tagDataList 标签时，明确指定其 type 属性为 "page"。例如，当你希望在文章列表页面显示每页10篇文章并提供分页时，archiveList 标签的用法会是这样：

{% archiveList archives with type="page" limit="10" %}
    {# 循环显示文章内容 #}
    {% for item in archives %}
        <li><a href="{{item.Link}}">{{item.Title}}</a></li>
    {% endfor %}
{% endarchiveList %}

这里，archives 将包含当前页面的文章数据，而 limit="10" 则定义了每页显示的文章数量。当 type 设置为 "page" 后，AnqiCMS 会自动识别当前页面的页码参数，并为 archiveList 调用后的上下文提供一个名为 pages 的分页对象。

构建分页导航：pagination 标签的应用

pagination 标签是专门用于生成分页导航的核心。它需要接收一个由内容列表标签（如 archiveList 或 tagDataList）提供的 pages 对象。这个 pages 对象包含了所有与分页相关的信息，比如总条数、总页数、当前页码、首页链接、上一页、下一页以及中间页码列表等。

典型的 pagination 标签用法如下：

{% pagination pages with show="5" %}
    {# 分页导航的具体HTML结构 #}
{% endpagination %}

这里的 pages 是 archiveList（或其他列表标签）在 type="page" 模式下提供的分页数据。show="5" 是一个可选参数，它指示分页导航最多显示5个中间页码按钮，这有助于保持导航的简洁性，避免页码过多时页面显得拥挤。

在 pagination 标签内部，我们可以利用 pages 对象的各个属性来构建完整的导航结构：

  • pages.TotalItems: 内容总条数。
  • pages.TotalPages: 内容总页数。
  • pages.CurrentPage: 当前访问的页码。
  • pages.FirstPage: 首页对象，包含 Name (如 “首页” 或 “1”) 和 Link。
  • pages.PrevPage: 上一页对象，仅当存在上一页时才提供，包含 Name (如 “上一页”) 和 Link。
  • pages.NextPage: 下一页对象，仅当存在下一页时才提供，包含 Name (如 “下一页”) 和 Link。
  • pages.LastPage: 末页对象，包含 Name (如 “末页” 或 最后一页的页码) 和 Link。
  • pages.Pages: 一个数组，包含了中间页码的列表，每个元素都是一个 pageItem 对象。

每个 pageItem 对象（例如 pages.Pages 数组中的每个 item）都包含 Name (页码数字), Link (对应页面的URL) 和 IsCurrent (一个布尔值，表示是否是当前页，可用于添加高亮样式)。

结合实例：为文章列表添加分页导航

现在，让我们把 archiveList 和 pagination 标签结合起来，为文章列表页面创建一个完整的分页导航。

<div class="article-list-section">
    {% archiveList articles with type="page" limit="10" %}
        {% for item in articles %}
            <div class="article-item">
                <h3><a href="{{item.Link}}">{{item.Title}}</a></h3>
                <p>{{item.Description}}</p>
                <div class="meta-info">
                    <span>{{stampToDate(item.CreatedTime, "2006-01-02")}}</span>
                    <span>{{item.Views}} 阅读</span>
                </div>
            </div>
        {% empty %}
            <p>目前没有找到任何文章。</p>
        {% endfor %}

        <div class="pagination-nav">
            {% pagination pages with show="5" %}
                <ul class="pagination-list">
                    {% if pages.FirstPage %} {# 确保首页存在 #}
                        <li class="page-item {% if pages.FirstPage.IsCurrent %}active{% endif %}">
                            <a href="{{pages.FirstPage.Link}}">{{pages.FirstPage.Name}}</a>
                        </li>
                    {% endif %}

                    {% if pages.PrevPage %} {# 确保上一页存在 #}
                        <li class="page-item">
                            <a href="{{pages.PrevPage.Link}}">{{pages.PrevPage.Name}}</a>
                        </li>
                    {% endif %}

                    {% for pageItem in pages.Pages %} {# 循环显示中间页码 #}
                        <li class="page-item {% if pageItem.IsCurrent %}active{% endif %}">
                            <a href="{{pageItem.Link}}">{{pageItem.Name}}</a>
                        </li>
                    {% endfor %}

                    {% if pages.NextPage %} {# 确保下一页存在 #}
                        <li class="page-item">
                            <a href="{{pages.NextPage.Link}}">{{pages.NextPage.Name}}</a>
                        </li>
                    {% endif %}

                    {% if pages.LastPage %} {# 确保末页存在 #}
                        <li class="page-item {% if pages.LastPage.IsCurrent %}active{% endif %}">
                            <a href="{{pages.LastPage.Link}}">{{pages.LastPage.Name}}</a>
                        </li>
                    {% endif %}
                </ul>
                <p class="pagination-summary">共 {{pages.TotalItems}} 条，{{pages.TotalPages}} 页，当前第 {{pages.CurrentPage}} 页</p>
            {% endpagination %}
        </div>
    {% endarchiveList %}
</div>

这段代码首先使用 archiveList 标签以分页模式（type="page"）获取文章列表，并设置每页显示10篇文章。接着，在 archiveList 标签的 endarchiveList 之前，我们嵌入了 pagination 标签，利用其提供的 pages 对象来渲染分页导航。通过判断 FirstPage, PrevPage, NextPage, LastPage 是否存在，以及 pageItem.IsCurrent 属性，我们可以灵活地控制分页按钮的显示和样式。

为分类列表或标签列表添加分页

无论是分类列表页面（显示某个分类下的文章），还是标签列表页面（显示带有某个标签的文章），其分页逻辑与上述文章列表完全相同。

  1. 分类列表页面: 在分类的模板文件中，你依然会使用 archiveList 标签，并自动根据当前分类上下文获取 categoryId，然后设置 type="page" 和 limit。

    {# 假设这是分类的list.html模板 #}
{% archiveList category_articles with type="page" limit="10" %}
    {# ... 显示文章内容 ... #}
    <div class="pagination-nav">
        {% pagination pages with show="5" %}
            {# ... 分页HTML结构，与上方示例相同 ... #}
        {% endpagination %}
    </div>
{% endarchiveList %}

  2. 标签列表页面: 在标签的模板文件（通常是 tag/list.html 或 tag/index.html）中，你需要使用 tagDataList 标签，同样设置 type="page" 和 limit。

    {# 假设这是tag/list.html模板 #}
{% tagDataList tagged_articles with type="page" limit="10" %}
    {# ... 显示带有该标签的文章内容 ... #}
    <div class="pagination-nav">
        {% pagination pages with show="5" %}
            {# ... 分页HTML结构，与上方示例相同 ... #}
        {% endpagination %}
    </div>
{% endtagDataList %}

通过以上方法，无论是文章列表、分类列表还是标签列表，你都可以轻松地为它们添加功能完善、样式灵活的分页导航。记住，关键在于正确使用列表标签的 type="page" 属性，并结合 pagination 标签来渲染分页链接。

常见问题 (FAQ)

Q1: 为什么我的文章列表页面没有显示分页导航，也没有出现分页链接？ A1: 请检查你的内容列表标签（如 archiveList 或 tagDataList）是否正确设置了 type="page" 属性。只有将 type 明确指定为 "page"，安企CMS才会为该列表生成分页数据，并提供给 pagination 标签使用。如果缺少这个属性，系统会将其视为普通列表，不会生成分页数据。

Q2: 如何调整分页导航中显示的页码按钮数量，比如我只想显示当前页前后2个页码？ A2: 你可以通过 pagination 标签的 show 属性来控制显示的页码按钮数量。例如，{% pagination pages with show="5" %} 会最多显示5个中间页码按钮（不包括首页、末页、上一页、下一页）。你可以根据自己的设计需求调整这个数字。

Q3: 我的分页链接URL格式看起来很奇怪，或者我希望自定义URL的显示方式，应该怎么做？ A3: 安企CMS的分页URL通常会遵循你后台设置的伪静态规则。如果URL看起来不符合预期，首先应该检查后台的“功能管理” -> “伪静态规则”设置，确保列表页面（如 archive 或 tag 规则）的URL格式是正确的。对于更高级的URL自定义需求，pagination 标签提供了一个 prefix 参数，允许你重定义分页URL的模式。但请注意，prefix 是一个高级功能，需要包含 {page} 占位符，且不当设置可能会导致页面无法访问，建议在熟悉系统伪静态机制后再尝试修改。