如何显示某个特定Tag下的所有文档列表?

在安企CMS中管理和展示内容,标签(Tag)无疑是一个极为灵活且强大的工具。它能帮助我们对内容进行多维度分类,不仅方便访客查找感兴趣的主题,也能有效提升网站的SEO表现。今天,我们就来深入探讨,如何在您的网站上优雅地显示某个特定标签(Tag)下的所有文档列表。

后台准备:确保标签设置妥当

在开始前端的显示之前,我们需要确保后台的标签设置是完整且规范的。

首先,您可以前往安企CMS后台的内容管理区域,找到文档标签模块。在这里,您可以创建、编辑和管理网站所有的标签。建议您为每个标签设置一个清晰的“标签名称”和有意义的“标签简介”,这有助于优化标签页面的SEO。

其次,在您发布或编辑文档时(无论是文章还是产品),务必在“Tag标签”字段中,为文档添加相关联的标签。您可以选择已有的标签,也可以直接输入新标签。只有文档与标签建立了关联,我们才能在前台将它们有效地聚合起来展示。

核心功能揭秘:理解模板标签的妙用

安企CMS提供了强大而易用的模板标签,让我们能够灵活地在前端调用各种内容。对于标签下的文档列表,我们将主要用到以下几个关键标签:

  • tagDetail: 用于获取某个特定标签自身的详细信息,比如标签ID、标题、描述和链接等。这在构建标签页的头部信息时非常有用。
  • tagList: 用于获取标签的列表,例如显示某个文档关联的所有标签,或者显示网站所有热门标签。
  • tagDataList: 这正是我们今天的主角!它专门用于获取指定标签下的所有文档列表。

要显示特定Tag下的文档列表,tagDataList标签是不可或缺的。它提供了丰富的参数,让您可以精确控制内容的筛选、排序和展示方式:

  • tagId: 这是核心参数,用于指定您想要显示哪个标签下的文档。如果您当前就在一个标签详情页面(例如 tag/list.htmltag/index.html 这样的模板),系统会自动识别当前页面的 tagId,此时您可以省略此参数。如果是在其他页面(如首页、分类页等)调用,则需要明确指定 tagId
  • moduleId: 如果您的网站使用了不同的内容模型(如文章模型、产品模型等),可以通过此参数指定只显示特定模型下的文档。例如,moduleId="1" 通常用于获取文章模型的文档。
  • type: 这个参数决定了列表的类型。type="list" 会简单地列出指定数量的文档,而 type="page" 则会生成带有分页功能的文档列表。
  • limit: 用于控制每页或每次调用显示的文档数量。比如 limit="10" 会显示10条文档。
  • order: 定义文档的排序方式,您可以根据发布时间(order="id desc")、浏览量(order="views desc")或后台自定义排序(order="sort desc")等进行设置。
  • siteId: 如果您管理着多个站点,并希望调用其他站点的数据,可以通过此参数指定站点ID。

实战演练:在模板中运用标签显示文档列表

现在,让我们通过具体的代码示例,看看如何在不同场景下运用tagDataList标签。

场景一:在标签列表页(tag/list.html)显示当前标签下的所有文档

当用户点击一个标签后,通常会跳转到一个专门的标签列表页面。在这种页面中,tagDataList标签会自动识别当前页面的标签ID,无需我们手动传入tagId。同时,为了提供更好的用户体验,我们通常会加入分页功能。

假设您的模板文件是 tag/list.html,代码结构可能如下:

”`twig {# 获取当前标签的详细信息,用于页面标题和描述 #} {% tagDetail currentTag with name=“Title” %} {% tagDetail tagDescription with name=“Description” %} {{currentTag}} - {% system with name=“SiteName” %}

标签: {{currentTag}}

{{tagDescription}}

{# 使用 tagDataList 获取当前标签下的文档列表,并启用分页 #}
{% tagDataList archives with type="page" limit="10" order="id desc" %}
    {% for item in archives %}
    <article class="document-item">
        <h2><a href="{{item.Link}}">{{item.Title}}</a></h2>
        {% if item.Thumb %}
            <div class="document-thumbnail">
                <a href="{{item.Link}}"><img src="{{item.Thumb}}" alt="{{item.Title}}"></a>
            </div>
        {% endif %}
        <p class="document-description">{{item.Description}}</p>
        <div class="document-meta">
            <span>发布日期: {{stampToDate(item.CreatedTime, "2006-01-02")}}</span>
            <span>浏览量: {{item.Views}}</span>
        </div>
    </article>
    {% empty %}
    <p>当前标签下暂时没有文档。</p>
    {% endfor %}
{% endtagDataList %}

{# 添加分页导航 #}
<div class="pagination-area">
    {% pagination pages with show="5" %}
        <ul>
            {% if pages.FirstPage %}
            <li><a class="{% if pages.FirstPage.IsCurrent %}active{% endif %}" href="{{pages.FirstPage.Link}}">{{pages.FirstPage.Name}}</a></li>
            {% endif %}
            {% if pages.PrevPage %}
            <li><a href="{{pages.PrevPage.Link}}">{{pages.PrevPage.Name}}</a></li>
            {% endif %}
            {% for item in pages.Pages %}
            <li><a class="{% if item.IsCurrent %}active{% endif %}" href="{{item.Link}}">{{item.Name}}