如何利用AnQiCMS的`tagList`标签显示与文章相关的标签列表及其链接?

📅 👁️ 77

在安QiCMS中管理和展示内容,标签(Tag)是一个非常实用的功能。它不仅能帮助您更好地组织文章内容,还能为用户提供更灵活的导航方式,并对搜索引擎优化(SEO)大有裨益。当读者浏览一篇文章时,如果能看到与其相关的标签列表,并能点击这些标签发现更多相似主题的内容,无疑会大大提升用户体验和网站的PV(页面浏览量)。

今天,我们就来深入了解如何在AnQiCMS中利用tagList标签,轻松地在文章页面显示与当前文章相关的标签列表及其链接。

标签的价值与AnQiCMS的标签管理

在AnQiCMS中,您可以在后台的“内容管理”模块下找到“文档标签”功能。发布或编辑文章时,系统提供了一个直观的界面让您为文章添加多个标签。这些标签可以是关键词、主题或任何您认为能概括文章内容的词语。

AnQiCMS的标签管理设计得很灵活,同一个标签可以关联不同内容模型下的文章。每个标签都可以有独立的名称、索引字母、自定义URL和SEO描述,这使得标签本身也成为网站内容体系中的重要组成部分,能够被搜索引擎更好地抓取和理解。

引入tagList标签:文章标签展示的核心

要在文章页面显示与当前文章相关联的标签列表,我们主要会用到AnQiCMS的内置标签tagList。这个标签专门用于获取和展示文档的标签信息。

tagList标签通常成对出现,格式如下:

{% tagList 变量名 with 参数 %}
    {# 循环处理标签数据的代码 #}
{% endtagList %}

其中,变量名 是您为获取到的标签列表定义的一个临时变量名称,例如articleTags。在标签内部,您可以使用for循环来遍历这个变量,从而逐一展示每个标签的详细信息。

实战演示:在文章详情页显示标签列表

假设您希望在每篇文章的底部,显示该文章所有已关联的标签,并让这些标签可以点击,跳转到该标签的专题页面。在AnQiCMS的文章详情模板(通常是{模型table}/detail.html)中,您可以这样编写代码:

{# 在文章详情页(例如:archive/detail.html)的合适位置 #}
<div class="article-tags-section">
    <strong>相关标签:</strong>
    {% tagList currentArticleTags %} {# 默认会自动获取当前文档的ID来显示相关标签 #}
        {% for item in currentArticleTags %}
            <a href="{{ item.Link }}" 
               class="tag-link" 
               title="查看更多关于 {{ item.Title }} 的内容">{{ item.Title }}</a>{% if not forloop.Last %}, {% endif %}
        {% empty %}
            <span>暂无相关标签。</span>
        {% endfor %}
    {% endtagList %}
</div>

在这段代码中:

  • {% tagList currentArticleTags %}:我们定义了一个名为 currentArticleTags 的变量来存储获取到的标签列表。当不指定 itemId 参数时,tagList 会智能地获取当前页面文章的ID,并显示其关联的所有标签。
  • {% for item in currentArticleTags %}:遍历 currentArticleTags 数组,item 变量在每次循环中代表一个具体的标签对象。
  • {{ item.Link }}:这是标签的链接地址。点击后,用户将被引导到该标签的聚合页面,显示所有带有此标签的文章。
  • {{ item.Title }}:这是标签的显示名称。
  • {% if not forloop.Last %}, {% endif %}:这是一个小技巧,用于在每个标签名称后添加逗号,但最后一个标签除外,使显示更自然。
  • {% empty %} ... {% endfor %}:如果当前文章没有关联任何标签,这部分内容就会显示,提示用户“暂无相关标签。”,避免页面出现空白。

灵活运用:探索tagList的更多参数

tagList标签还提供了一些参数,让您能够更精细地控制标签的显示方式。

  1. itemId:指定或获取全站标签

    • 默认行为(不带itemId:如上例所示,在文章详情页,它会自动获取当前文章的标签。
    • 指定文章ID:如果您想显示特定ID文章的标签,而不是当前页面的,可以这样使用:
      
      {# 显示ID为123的文章的所有标签 #}
      {% tagList specificArticleTags with itemId="123" %}
          {% for item in specificArticleTags %}
              <a href="{{ item.Link }}">{{ item.Title }}</a>
          {% endfor %}
      {% endtagList %}
      
    • 获取全站所有标签:如果您想在侧边栏、页脚或独立的标签页(例如tag/index.html)显示全站所有标签,可以设置itemId="0"
      
      {# 在侧边栏或页脚显示全站热门标签 #}
      <div class="site-tag-cloud">
          <h3>热门标签</h3>
          {% tagList allSiteTags with itemId="0" limit="30" %} {# itemId="0" 表示获取所有标签,不与当前文章关联 #}
              {% for item in allSiteTags %}
                  <a href="{{ item.Link }}">{{ item.Title }}</a>
              {% endfor %}
          {% endtagList %}
      </div>
      
  2. limit:控制显示数量 这个参数可以限制显示的标签数量。例如,如果您只想显示最热门的10个标签,可以这样:

    {# 显示当前文章的前5个标签 #}
    {% tagList limitedTags with limit="5" %}
        {% for item in limitedTags %}
            <a href="{{ item.Link }}">{{ item.Title }}</a>
        {% endfor %}
    {% endtagList %}
    

    limit还支持offset模式,例如limit="2,10"表示从第2个

相关文章

AnQiCMS的“全站内容替换”功能是否会即时影响前端内容的显示?

在内容运营中,有时我们需要对网站上的大量内容进行统一调整,无论是更新过期信息、修正品牌名称,还是优化内部链接,手动逐一修改无疑是巨大的工作量。AnQiCMS 提供了一个名为“全站内容替换”的强大功能,旨在帮助我们高效地解决这类问题。然而,许多用户在使用这个功能时可能会有一个疑问:全站内容替换操作完成后,网站前端的内容是否会立即同步更新,让访问者看到最新的修改呢? 要理解这个问题

2025-11-09

如何在AnQiCMS前端页面集成并显示后台自定义的联系方式,如WhatsApp链接?

在AnQiCMS上,我们经常需要让访客以最便捷的方式联系到我们,而WhatsApp因其广泛的使用率,成为了许多企业和个人首选的联系工具。幸运的是,AnQiCMS在设计之初就充分考虑了内容和功能的灵活性,让您能够轻松地在后台自定义联系方式,并将其展示在网站的前端页面上。 这篇文章将详细为您介绍如何在AnQiCMS后台添加并管理像WhatsApp这样的自定义联系方式

2025-11-09

AnQiCMS如何调用并显示指定分类下的子分类列表或其关联文章列表?

在使用AnQiCMS进行网站内容管理时,我们经常需要根据特定的内容组织方式来展示信息。其中,如何灵活地调用并展示某个指定分类下的子分类列表,或者该分类所关联的文章列表,是许多用户会遇到的场景。AnQiCMS强大的模板引擎和丰富的标签功能,让实现这些需求变得直观且高效。 AnQiCMS采用了类似Django模板引擎的语法,这意味着您可以通过简洁的标签来获取和渲染数据,而无需深入复杂的编程代码

2025-11-09

如何在AnQiCMS模板中显示当前文章的“上一篇”和“下一篇”文档链接和标题?

网站内容的有效组织和便捷导航,是提升用户体验、延长访问时长的关键所在。当访客沉浸在您的文章中时,如果能无缝地跳转到相关或相邻的内容,无疑会大大增强其浏览的连贯性。AnQiCMS作为一个功能完善的内容管理系统,提供了直观且强大的模板标签,帮助我们轻松实现在文章详情页中显示“上一篇”和“下一篇”文档的链接和标题。 ###

2025-11-09

AnQiCMS如何确保上传的JPG/PNG图片自动转换为WebP格式以优化前端加载显示?

在当今的数字时代,网站加载速度对用户体验和搜索引擎排名至关重要。其中,图片文件作为网页内容的重要组成部分,其加载效率往往直接影响整体性能。传统JPG和PNG格式的图片虽然广泛使用,但在文件体积上通常不如新兴的WebP格式高效。那么,如何让安企CMS(AnQiCMS)在图片上传时自动实现这一优化,从而提升网站的前端加载显示呢? 安企CMS提供了一项非常实用的内置功能

2025-11-09

如何设置AnQiCMS以自动压缩大图,并指定显示宽度以提升页面加载性能?

在当今的数字时代,网站的加载速度直接影响着用户体验、搜索引擎排名乃至业务转化率。而图片作为网页内容的重要组成部分,其大小和加载方式往往是影响页面性能的关键因素之一。如果网站上存在大量未经优化的巨幅图片,即使内容再精彩,也可能让访客望而却步。 幸运的是,AnQiCMS(安企内容管理系统)为我们提供了强大的内置功能,可以智能地处理图片,自动压缩大图并指定显示宽度,从而显著提升网站的页面加载性能

2025-11-09

AnQiCMS如何配置缩略图的生成处理方式(如裁剪、按最长边缩放)以优化显示效果?

在内容运营中,图片扮演着至关重要的角色,而缩略图作为内容的“门面”,其显示效果直接影响着用户的第一印象和点击意愿。一个清晰、美观且加载迅速的缩略图,不仅能提升网站的整体视觉体验,还能有效优化搜索引擎的抓取和排名,可谓一举多得。那么,在 AnQiCMS 中,我们究竟如何精细化地配置缩略图的生成处理方式,以达到**的显示效果呢? ### 为什么缩略图的配置如此重要? 想象一下

2025-11-09

如何在AnQiCMS的首页TDK设置中,控制首页标题是否附加网站名称后缀?

网站的首页标题(Title)是搜索引擎优化(SEO)的关键要素之一,它不仅直接影响用户在搜索结果中点击网站的意愿,也承载着品牌信息传达的重要职责。在AnQiCMS(安企内容管理系统)中,我们常常会遇到一个问题:如何灵活地控制首页标题,使其在展示核心内容的同时,根据需要附加或不附加网站的名称作为后缀?AnQiCMS为此提供了直观且高效的设置方法。 ###

2025-11-09