在使用安企CMS（AnQiCMS）构建网站时，当我们需要展示大量内容，例如文章列表、产品列表等，合理的分页导航就显得尤为重要。它不仅能提升用户体验，让访问者更容易浏览和查找内容，也有助于搜索引擎更好地抓取网站。安企CMS提供了非常直观且功能强大的分页标签，让内容列表的分页显示变得轻而易举。

第一步：准备内容列表数据

要实现内容列表的分页显示，首先需要使用 archiveList 标签来获取数据。这个标签是安企CMS中用于调用各种类型文档列表的核心。关键在于，我们需要明确告诉系统，这个列表是需要分页的，而不是一次性全部加载。

为此，在使用 archiveList 标签时，需要将 type 参数设置为 "page"。同时，通过 limit 参数来指定每页希望显示多少条内容。例如，如果想在当前分类下，每页显示10篇文章，可以这样设置：

{% archiveList archives with type="page" limit="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>
            </a>
        </li>
    {% endfor %}
{% endarchiveList %}

在这里，archives 是我们自定义的一个变量名，它包含了当前页的所有文章数据。接下来的 for 循环会遍历这些数据，将每篇文章的标题、链接、简介和发布日期等信息展示出来。

第二步：引入分页标签，构建导航

在 archiveList 标签获取并显示了当前页内容之后，紧接着就可以引入安企CMS的分页标签 pagination 来生成分页导航了。这个标签通常放置在 archiveList 标签的闭合之后。

pagination 标签需要一个变量来存储分页信息，通常我们会将其命名为 pages。此外，show 参数非常实用，它决定了在分页导航中最多同时显示多少个页码按钮，比如 show="5" 表示最多显示5个页码。

分页标签会提供一系列内置的对象和属性，帮助我们构建完整的导航结构，包括：

  • pages.TotalItems：内容总数。
  • pages.TotalPages：总页数。
  • pages.CurrentPage：当前所在页码。
  • pages.FirstPage、pages.LastPage：指向第一页和最后一页的对象。
  • pages.PrevPage、pages.NextPage：指向上一页和下一页的对象。
  • pages.Pages：一个包含所有中间页码信息的数组，可以通过 for 循环来遍历显示。

每个页码对象（例如 pages.FirstPage 或 pages.Pages 中的 item）都包含 Name（页码显示名称）、Link（页码链接）和 IsCurrent（是否为当前页，用于高亮显示）等属性。

下面是一个构建分页导航的通用示例：

<div>
    {% 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>

通过上述代码，你将得到一个功能完善的分页导航，包含了第一页、上一页、下一页、最后一页以及中间的页码链接，并且当前页会带有 active 样式类以便于高亮显示。

完整示例：文章列表与分页导航

将以上两个步骤结合起来，就能在安企CMS中轻松实现内容列表的分页导航显示。

<div class="article-list-container">
    {# 第一步：获取需要分页的文章列表数据 #}
    {% archiveList archives with type="page" limit="10" %}
        {# 循环显示文章内容 #}
        {% for item in archives %}
            <div class="article-item">
                <a href="{{item.Link}}">
                    <h3>{{item.Title}}</h3>
                    <p>{{item.Description}}</p>
                    <small>发布于：{{stampToDate(item.CreatedTime, "2006-01-02")}}</small>
                </a>
            </div>
        {% empty %}
            <p>该分类下暂时没有文章。</p>
        {% endfor %}
    {% endarchiveList %}

    {# 第二步：生成分页导航 #}
    <div class="pagination-container">
        {% pagination pages with show="5" %}
            <ul class="pagination-nav">
                <li class="pagination-info">总计：{{pages.TotalItems}}条，共{{pages.TotalPages}}页，当前第{{pages.CurrentPage}}页</li>

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

                {% if pages.PrevPage %}
                    <li class="page-link-item"><a href="{{pages.PrevPage.Link}}">{{pages.PrevPage.Name}}</a></li>
                {% endif %}

                {% for item in pages.Pages %}
                    <li class="page-link-item {% if item.IsCurrent %}active{% endif %}">
                        <a href="{{item.Link}}">{{item.Name}}</a>
                    </li>
                {% endfor %}

                {% if pages.NextPage %}
                    <li class="page-link-item"><a href="{{pages.NextPage.Link}}">{{pages.NextPage.Name}}</a></li>
                {% endif %}

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

通过这些简单的标签组合，安企CMS能够帮助你快速地为网站内容添加分页功能，无论是文章、产品还是其他自定义内容模型，都能轻松实现，大大提升网站的实用性和用户体验。

常见问题 (FAQ)

1. 为什么我的内容列表页面没有显示分页导航？

通常情况下，这可能是因为在使用 archiveList 或 tagDataList 等内容列表标签时，没有将 type 参数设置为 "page"。只有当 type="page" 时，安企CMS才会计算分页信息并提供给 pagination 标签使用。另外，也要检查 limit 参数是否设置得当，如果内容总数不足一页（即小于等于 limit 值），系统也不会显示分页导航。

2. 如何调整每页显示的内容数量？

要调整每页显示的内容数量，只需修改 archiveList 标签中的 limit 参数值。例如，将 limit="10" 改为 limit="20" 即可让每页显示20条内容。这个参数直接决定了分页的数量和每页内容的密度。

3. 分页链接的URL格式是如何生成的？我可以自定义吗？

安企CMS的分页链接URL格式是根据您在后台配置的“伪静态规则”自动生成的。例如，如果您选择的是数字模式，链接可能像 /archive/page-2.html 这样；如果是模型命名模式，可能会包含模型名称。通常，默认的伪静态规则就能满足大部分需求。如果需要高度自定义，您可以在 pagination 标签中使用 prefix 参数来重定义URL模式，但这个功能比较高级，需要包含 {page} 占位符来指示页码位置，并且需要确保与您网站的路由规则相匹配。