How to get and display the list of all documents under a specific Tag tag?
As a website operator who is well-versed in the operation of AnQiCMS, I fully understand the importance of efficient content management and optimization.Tags are one of the key elements for organizing content, enhancing user experience, and improving SEO performance.By using tags, we can not only provide readers with more precise content aggregation, but also help search engines better understand the structure of the website content.I will elaborate in detail on how to obtain and display the list of all documents under a specific Tag label in AnQiCMS.
The role and display requirements of Tag labels in AnQi CMS
In AnQiCMS, Tag is a flexible content classification method that goes beyond the hierarchical limitations of traditional classification, allowing content to be connected in a more relevant and thematic way.For example, an article about "AnQiCMS template creation" can be classified under "Technical Tutorial" and can also be tagged with "Template", "Front-end", "Go Language", and many other tags.This greatly enriches the relationship network between content, making it convenient for users to explore more related content based on their interests.
When we need to display all documents under a specific Tag label, we usually do so on the "Tag Details Page" (for exampletag/list.htmlOr other modules of the website (such as the popular tag articles in the sidebar, or the related tag articles at the bottom of the page) can be used. AnQiCMS provides special template tags to meet this need, the core of which istagDataList.
applytagDataListLabel to get document list
In the AnQiCMS template system,tagDataListIt is a key label used to get the document list associated with a specified Tag. Its design aims to implement this function in a concise and efficient manner.
To usetagDataListWe need to wrap it in aforloop because the tag returns an array of document (archive) objects. The basic usage is as follows:
{% tagDataList archives with tagId="1" type="page" limit="10" %}
{# 循环遍历文档列表 #}
{% for item in archives %}
{# 文档信息的显示代码 #}
{% endfor %}
{% endtagDataList %}
IntagDataListIn the tag, there are some important parameters that can help us accurately control the document list obtained:
tagId: This is the unique identifier for the target Tag. If you are on a Tag detail page (such astag/list.html), the system will usually automatically identify the current page.tagIdAt this point, you can omit this parameter. If you want to manually specify a document list for a Tag on another page, you need to explicitly settagId="X"where X is the Tag ID.moduleId: If your website has multiple content models (such as articles, products), and you only want to retrieve Tag documents under specific models, you can setmoduleId="Y"to filter (for example,moduleId="1"It may represent an article model).order: This parameter is used to control the sorting method of the document. Common options includeid desc(Sorted by latest release in reverse order),views desc(Sorted by views in reverse order),sort desc(Sorted by custom sorting in the background).limit: Determines the maximum number of documents displayed in the list. If you want to display in paginated format, you can set the number of documents per page, for example,limit="10". If it is not a paged list, it can also be usedoffsetpattern, such aslimit="2,10"It means to get 10 data items starting from the 2nd one.type: This parameter is very critical, it determinestagDataListthe return type. When set totype="page"It will return an object that supports pagination, which can be配合 used laterpaginationtag to implement pagination functionality. If set totype="list", it will only return the specifiedlimitnumber of documents without providing pagination information.siteId: If you are using the AnQiCMS multi-site management feature and need to access Tag documents under other sites, you can specifysiteId="Z"to achieve.
tagDataListthe tags returned byarchivesA variable is an array where eachitemrepresents a document containing rich field information such as:Id(Document ID),Title(Document Title),Link(Document Link),Description(Document description),Thumb(thumbnail),CreatedTime(Creation time, to be usedstampToDateformatted),Views(Views) etc.
Actual template code example
Assuming we are editingtag/list.htmlA template, hoping to display the name of the current tag, as well as all articles under the tag, and provide pagination functionality.
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>{% tdk with name="Title" siteName=true %}</title>
<meta name="keywords" content="{% tdk with name="Keywords" %}">
<meta name="description" content="{% tdk with name="Description" %}">
<link rel="stylesheet" href="{% system with name="TemplateUrl" %}/css/style.css">
</head>
<body>
{# 导航栏或其他页面头部 #}
{% include "partial/header.html" %}
<div class="main-content">
<div class="container">
{# 获取当前标签的详细信息，例如标签名称 #}
{% tagDetail currentTag with name="Title" %}
<h1>标签：{{ currentTag }} 下的文档</h1>
<div class="tag-documents-list">
{% tagDataList archives with type="page" limit="10" %}
{% for item in archives %}
<div class="document-item">
<a href="{{item.Link}}" class="document-link">
<h2>{{item.Title}}</h2>
{% if item.Thumb %}
<img src="{{item.Thumb}}" alt="{{item.Title}}" class="document-thumbnail">
{% endif %}
<p class="document-description">{{item.Description}}</p>
</a>
<div class="document-meta">
<span>发布于：{{stampToDate(item.CreatedTime, "2006-01-02")}}</span>
<span>浏览：{{item.Views}}次</span>
{# 获取文档所属分类的名称 #}
<span>分类：{% categoryDetail with name="Title" id=item.CategoryId %}</span>
</div>
</div>
{% empty %}
<p class="no-documents">当前标签下暂无任何文档。</p>
{% endfor %}
{# 列表分页代码 #}
{% pagination pages with show="5" %}
<nav aria-label="Page navigation" class="pagination-wrapper">
<ul class="pagination">
{% if pages.FirstPage %}
<li class="page-item {% if pages.FirstPage.IsCurrent %}active{% endif %}">
<a class="page-link" href="{{pages.FirstPage.Link}}">{{pages.FirstPage.Name}}</a>
</li>
{% endif %}
{% if pages.PrevPage %}
<li class="page-item">
<a class="page-link" href="{{pages.PrevPage.Link}}">{{pages.PrevPage.Name}}</a>
</li>
{% endif %}
{% for p in pages.Pages %}
<li class="page-item {% if p.IsCurrent %}active{% endif %}">
<a class="page-link" href="{{p.Link}}">{{p.Name}}</a>
</li>
{% endfor %}
{% if pages.NextPage %}
<li class="page-item">
<a class="page-link" href="{{pages.NextPage.Link}}">{{pages.NextPage.Name}}</a>
</li>
{% endif %}
{% if pages.LastPage %}
<li class="page-item {% if pages.LastPage.IsCurrent %}active{% endif %}">
<a class="page-link" href="{{pages.LastPage.Link}}">{{pages.LastPage.Name}}</a>
</li>
{% endif %}
</ul>
</nav>
{% endpagination %}
{% endtagDataList %}
</div>
</div>
</div>
{# 页脚或其他页面底部 #}
{% include "partial/footer.html" %}
</body>
</html>
In this code, we first usetagDetailGet the title of the current Tag, as the main title of the page. Next,tagDataListStart withtype="page"method to get the document list, and set 10 documents per page.forInside the loop, we displayed the document title, link, thumbnail, description, publication time, views, and category. Finally, throughpaginationtags generated the complete pagination navigation.
Advanced usage and注意事项
In practice, you may have more complex requirements.For example, on the homepage or in the sidebar of the article detail page, display several of the latest documents under a specific hot Tag.tagIdandlimitAnd, totypeis set tolist:
{# 在首页或侧边栏显示Tag ID为5的最新5篇文档 #}
<h3>热门标签文章</h3>
<ul>
{% tagDataList hotArticles with tagId="5" type="list" limit="5" order="id desc" %}
{% for item in hotArticles %}
<li><a href="{{item.Link}}">{{item.Title}}</a></li>
{% empty %}
<li>暂无热门标签文章。</li>
{% endfor %}
{% endtagDataList %}
</ul>
Remember, AnQiCMS template tags are case-sensitive, be sure to write accurately according to the field names and parameter names provided in the documentation. By usingtagDataListAnd other auxiliary labels, you can build highly customized, rich in content, and easy-to-navigate web page.
Summary
AnQiCMS'tagDataListThe tag provides a powerful and flexible tool for website operators to retrieve and display document lists under specific Tag tags.Whether it is to build a dedicated tag archive page or display related content in other areas of the website, the tag can meet the diverse content aggregation needs through simple parameter configuration.