`archiveList`标签如何实现文档列表、相关文档、搜索结果的分页显示?

在安企CMS中管理网站内容,无论是博客文章、产品展示还是新闻资讯,都离不开高效的列表展示。当内容量逐渐增大时,如何优雅地呈现大量文档,并确保用户能轻松浏览和查找,就成了运营者需要关注的重点。这时,archiveList 标签及其配合的分页功能,便成为了我们手中的强大工具,它不仅能实现常规文档列表的分页,还能灵活应用于相关文档和搜索结果的显示。

文档列表的分页显示

想象一下,您的网站上有一个“最新文章”或“产品中心”页面,其中包含了成百上千条内容。如果没有分页,用户可能需要无休止地滚动才能找到想要的信息,这无疑会极大地影响用户体验。安企CMS的archiveList标签,正是为解决这一问题而生。

要实现文档列表的分页显示,我们主要会用到archiveList标签的type="page"参数。这个参数告诉系统,我们希望获取一个可分页的文档集合。同时,limit参数用于设定每页显示多少条文档,例如limit="10"表示每页展示10条。

以下代码片段展示了如何在模板中获取并显示一个分类下的文档列表,并搭配分页功能:

{# 假设我们想显示分类ID为1的文章列表,每页显示10条 #}
<div>
    {% archiveList archives with type="page" categoryId="1" limit="10" order="id desc" %}
        {% for item in archives %}
        <div class="document-item">
            <h3><a href="{{item.Link}}">{{item.Title}}</a></h3>
            <p>{{item.Description}}</p>
            <small>发布于: {{stampToDate(item.CreatedTime, "2006-01-02")}} | 浏览量: {{item.Views}}</small>
            {% if item.Thumb %}
            <a href="{{item.Link}}"><img src="{{item.Thumb}}" alt="{{item.Title}}"></a>
            {% endif %}
        </div>
        {% empty %}
        <p>当前分类下暂时没有文档。</p>
        {% endfor %}
    {% endarchiveList %}

    {# 分页导航区域,通常紧跟在文档列表之后 #}
    <div class="pagination-controls">
        {% pagination pages with show="5" %}
            {# 显示“首页”链接 #}
            <a class="{% if pages.FirstPage.IsCurrent %}active{% endif %}" href="{{pages.FirstPage.Link}}">{{pages.FirstPage.Name}}</a>
            {# 显示“上一页”链接(如果存在) #}
            {% if pages.PrevPage %}
            <a href="{{pages.PrevPage.Link}}">{{pages.PrevPage.Name}}</a>
            {% endif %}
            {# 循环显示中间的页码链接,例如:1 2 3 4 5 #}
            {% for item in pages.Pages %}
            <a class="{% if item.IsCurrent %}active{% endif %}" href="{{item.Link}}">{{item.Name}}</a>
            {% endfor %}
            {# 显示“下一页”链接(如果存在) #}
            {% if pages.NextPage %}
            <a href="{{pages.NextPage.Link}}">{{pages.NextPage.Name}}</a>
            {% endif %}
            {# 显示“尾页”链接 #}
            <a class="{% if pages.LastPage.IsCurrent %}active{% endif %}" href="{{pages.LastPage.Link}}">{{pages.LastPage.Name}}</a>
        {% endpagination %}
    </div>
</div>

在这段代码中,archiveList负责获取数据,archives变量包含了当前页的所有文档数据,我们通过for循环遍历展示。而pagination标签则负责生成页码导航,pages变量提供了总页数、当前页、首页、尾页、上一页、下一页以及中间页码等信息,让您可以灵活构建各种样式的分页条。show="5"参数控制着中间页码链接最多显示5个。此外,您还可以通过moduleId指定内容模型(例如文章或产品),或使用order参数(如order="views desc"按浏览量排序)来对文档进行更精细的筛选和排序。

相关文档列表的优雅呈现

当用户阅读完一篇精彩的文章,自然会希望看到更多相关内容。在安企CMS中,archiveList标签同样能够帮助我们实现这一点,不过这里通常不是分页,而是展示一个固定数量的相关文档列表。

要获取相关文档,我们将archiveListtype参数设置为"related"。系统会智能地根据当前文档的关键词或分类,推荐最贴近的相关内容。limit参数在这里就显得尤为重要,因为它直接控制了相关文档的显示数量。

以下是一个在文档详情页展示相关文章的例子:

{# 假设这是在文档详情页的模板中 #}
<div class="related-documents">
    <h3>相关推荐</h3>
    <ul>
        {% archiveList archives with type="related" limit="5" %} {# 获取最多5条相关文档 #}
        {% for item in archives %}
        <li>
            <a href="{{item.Link}}">
                <img src="{{item.Thumb}}" alt="{{item.Title}}">
                <span>{{item.Title}}</span>
            </a>
        </li>
        {% empty %}
        <li>暂无相关文档。</li>
        {% endfor %}
    {% endarchiveList %}
    </ul>
</div>

在这个场景下,我们通常不会对相关文档进行分页,而是展示一个精选的小列表。limit="5"确保页面布局简洁,不会被过多的内容打扰。如果您希望更精确地控制相关逻辑,还可以尝试like="keywords"(根据关键词匹配)或like="relation"(仅显示后台手动关联的文档)。

搜索结果页的分页实现

您的网站内容日益丰富,用户如何快速找到所需信息?一个高效的搜索功能是必不可少的。安企CMS的archiveList标签也能够完美处理搜索结果的展示和分页。

在搜索结果页面,archiveList标签同样使用type="page"来启用分页。关键在于引入q参数,它会根据用户输入的关键词进行文档标题匹配。当用户在搜索框中提交查询后,通常页面URL会带上q=关键词这样的参数,archiveList会自动读取这个URL参数进行搜索。

首先,您需要一个搜索表单:

<form method="get" action="/search"> {# 假设搜索结果页的URL是/search #}
    <input type="text" name="q" placeholder="请输入搜索关键词" value="{{urlParams.q}}"> {# value="{{urlParams.q}}"用于保留搜索框中的关键词 #}
    <button type="submit">搜索</button>
</form>

接着,在/search页面(或者您定义的搜索结果模板文件),您可以这样展示搜索结果并实现分页:

”`twig

<h3>搜索结果: {{urlParams.q}}</h3>
{% archiveList archives with type="page" limit="10" %} {# 这里不需要显式指定q,因为它会从URL中自动读取 #}
    {% for item in archives %}
    <div class="search-result-item">
        <h4><a href="{{item.Link}}">{{item.Title}}</a></h4>
        <p>{{item.Description}}</p>
        <small>分类: {% categoryDetail with name="Title" id=item.CategoryId %}</small>
    </div>
    {% empty %}
    <p>抱歉,没有找到与“{{urlParams.q}}”相关的文档。</p>
    {% endfor %}
{% endarchiveList %}

{# 搜索结果的分页与普通列表分页相同 #}
<div class="pagination-controls">
    {% pagination pages with show="5" %}
        <a class="{% if pages.FirstPage.IsCurrent %}active{% endif %}" href="{{pages.FirstPage.Link}}">{{pages.FirstPage.Name}}</a>
        {% if pages.PrevPage %}
        <a href="{{pages.PrevPage.Link}}">{{pages.PrevPage.Name