如何显示一个特定Tag标签下所有关联的文章列表？

在安企CMS中，标签（Tag）是组织内容、提升用户体验和优化搜索引擎表现的重要工具。它能将不同分类但主题相关的文章关联起来，让访问者更容易找到感兴趣的内容。当您需要展示一个特定Tag标签下所有关联的文章列表时，安企CMS提供了简洁而强大的模板标签来帮助您实现这一目标。

理解核心：tagDataList 标签

要显示特定Tag标签下的文章列表，我们主要会用到安企CMS内置的 tagDataList 标签。这个标签专门用于获取与某个Tag关联的文章数据。它功能灵活，可以根据您的需求来筛选、排序和分页显示文章。

一个基础的 tagDataList 标签用法大致是这样的：

{% tagDataList archives with tagId="1" %}
    {# 在这里循环显示文章内容 #}
{% endtagDataList %}

其中，archives 是您自定义的一个变量名，用于存储获取到的文章列表数据。tagId="1" 则是关键，它告诉系统您想获取ID为1的Tag所关联的文章。

如何获取特定Tag的ID？

在实际操作中，您可能需要明确知道Tag的ID才能调用 tagDataList。这里有两种常见的场景：

  1. 在专门的Tag列表页中（例如：template/your_template_name/tag/list.html） 如果您正在编辑的是一个专门用于展示某个Tag下文章的页面，比如用户点击Tag云中的某个标签后跳转的页面，那么安企CMS通常会自动识别当前页面的Tag ID。在这种情况下，您甚至可以省略 tagId 参数，tagDataList 会自动获取当前Tag的数据。 此外，您还可以通过 tagDetail 标签来获取当前Tag的详细信息，比如Tag的标题和描述，这对于构建页面标题和SEO描述非常有用。

    {# 假设当前是Tag列表页，系统会自动识别当前Tag的ID #}
{% tagDetail currentTag with name="Title" %}
<h1>{{ currentTag }} 标签下的文章</h1>


{% tagDetail tagDescription with name="Description" %}
<p>{{ tagDescription }}</p>


{% tagDataList archives with type="page" limit="10" %}
    {# 接下来是文章列表和分页代码 #}
{% endtagDataList %}

  2. 在其他任意页面中显示特定Tag的文章 如果您想在网站的首页、某个分类页或文章详情页中，展示一个固定Tag下的文章，您就需要手动指定 tagId。这个ID可以在安企CMS后台的“内容管理” -> “文档标签”页面找到。点击相应的Tag编辑，就能看到它的ID。

    例如，假设您知道“最新动态”这个Tag的ID是5，您就可以这样调用：

    <h2>最新动态</h2>
{% tagDataList archives with tagId="5" limit="5" order="id desc" %}
    {% for item in archives %}
        <li><a href="{{ item.Link }}">{{ item.Title }}</a></li>
    {% empty %}
        <li>暂无相关文章。</li>
    {% endfor %}
{% endtagDataList %}

构建文章列表

tagDataList 标签支持多种参数，让您能更精细地控制文章的显示：

  • tagId：指定Tag的ID。如 tagId="1"。
  • moduleId：如果您的网站有多种内容模型（如文章模型、产品模型），可以通过此参数指定只显示特定模型下的文章。例如 moduleId="1" 表示只显示文章模型的数据。
  • limit：控制显示的文章数量。例如 limit="10" 会显示10篇文章。
  • order：指定文章的排序方式，常见的有：
    • order="id desc"：按文章ID倒序（通常是最新发布）
    • order="views desc"：按浏览量倒序（热门文章）
    • order="sort desc"：按后台自定义排序
  • type：定义列表类型。type="list" 会直接列出指定数量的文章；type="page" 则会启用分页功能，配合 pagination 标签使用。

在 {% for item in archives %} 循环中，item 变量包含了每篇文章的详细信息，您可以根据需要调用：

  • item.Title：文章标题
  • item.Link：文章链接
  • item.Description：文章简介
  • item.Thumb：文章缩略图
  • item.Views：文章浏览量
  • item.CreatedTime：文章发布时间（需要用 stampToDate 过滤器格式化）

例如，展示文章标题、缩略图和发布时间：

{% tagDataList archives with tagId="您要查询的TagID" moduleId="1" limit="10" order="id desc" %}
    {% for item in archives %}
        <div class="article-item">
            {% if item.Thumb %}
                <a href="{{ item.Link }}"><img src="{{ item.Thumb }}" alt="{{ item.Title }}"></a>
            {% endif %}
            <h3><a href="{{ item.Link }}">{{ item.Title }}</a></h3>
            <p>{{ item.Description | truncatechars:100 }}</p>
            <span class="publish-date">{{ stampToDate(item.CreatedTime, "2006-01-02") }}</span>
        </div>
    {% empty %}
        <p>当前Tag下暂无文章。</p>
    {% endfor %}
{% endtagDataList %}

引入分页功能

如果Tag下的文章数量较多，启用分页能有效提升加载速度和用户体验。您需要在 tagDataList 中设置 type="page"，然后结合 pagination 标签来生成分页链接。

{% tagDataList articles with tagId="您的TagID" moduleId="1" type="page" limit="10" order="id desc" %}
    {# 循环显示文章的for循环和内容 #}
    {% for item in articles %}
        <div class="article-item">
            <h3><a href="{{ item.Link }}">{{ item.Title }}</a></h3>
            <p>{{ item.Description }}</p>
            <span class="publish-date">{{ stampToDate(item.CreatedTime, "2006-01-02") }}</span>
        </div>
    {% empty %}
        <p>当前Tag下没有找到任何文章。</p>
    {% endfor %}

    {# 分页代码 #}
    <div class="pagination-area">
        {% 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 %}
            {# 中间页码 #}
            {% for page_item in pages.Pages %}
                <a class="{% if page_item.IsCurrent %}active{% endif %}" href="{{ page_item.Link }}">{{ page_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>
{% endtagDataList %}

完整的Tag文章列表页面示例

这是一个典型的 tag/list.html 模板文件的结构，它结合了Tag详情、文章列表和分页功能，为您的Tag页面提供全面的内容展示：

”`twig {% extends ‘base.html’ %} {# 继承您的基础模板 #}

{% block head_meta %}

{# 获取当前Tag的SEO信息，并显示在页面的meta标签中 #}
<title>{% tdk with name="Title" siteName=true %}</title>
<meta name="keywords" content="{% tdk with name="Keywords" %}">
<meta name="description" content="{% tdk with name="Description" %}">
{% tdk canonical with name="CanonicalUrl" %}
{% if canonical %}<link rel="canonical" href="{{ canonical }}" />{% endif %}

{% endblock %}

{% block content %}

{# 获取当前Tag的详细信息，用于页面标题和简介 #}
{% tagDetail currentTag with name="Title" %}
<h1>标签：{{ current