As an experienced website content expert in the operation of Anq CMS, I deeply understand the readers' desire for efficient content management and display.Tags act as an important means of content organization, which can greatly enhance the discoverability and user experience of content.In Anqi CMS, correctly utilizing the tag function can help your website achieve more refined content aggregation and distribution.
This article will elaborate on how to list all related document lists under the specified Tag label in Anqi CMS, helping you better organize and present website content.
Understand the tag function of AnQi CMS in depth
The AnQi CMS tag feature is aimed at providing flexible topic classification for content.Tags are more like keywords or thematic words of the content, allowing a document to be associated with multiple tags, thus achieving cross-references between content across different dimensions.The background document tag management function allows you to create, edit, and manage these tags and apply them to various documents such as articles, products, and more.This mechanism makes content organization more flexible and also provides users with diverse content exploration paths.
Core template tag:tagDataListUsage of
AnQi CMS provides a special template tag to list all relevant documents under the specified Tag tag on the website front-endtagDataList. This tag is the key tool for implementing this feature, which can retrieve and return all associated document lists based on the provided tag ID.
tagDataListTag syntax and parameters
tagDataListThe basic usage of tags is:{% tagDataList archives with tagId="1" %}...{% endtagDataList %}. Here,archivesIs a custom variable name that will carry the document collection retrieved from the tag.
The tag supports multiple parameters to meet different content display requirements:
tagId: Specify the tag IDThis is the most core parameter, used to specify which tag's documents you want to list. For example,tagId="1"It will list all documents under the tag with ID 1. It should be noted that if not specifiedtagIdIn the case, this tag will automatically attempt to read the TagID of the current Tag page, which is very convenient when building the tag detail page.moduleId: Filter by content modelIf you want to list documents under specific content models (such as articles, products) only, you can use this parameter. For example,moduleId="1"it will only retrieve documents under the article model.order: Sorting rulesYou can set the document sorting method according to your needs, for exampleorder="id desc"Sorted by the most recent release,order="views desc"Sorted by views from high to low, ororder="sort desc"sort by backend custom sorting.limitControl the number of displayed items.This parameter is used to limit the number of documents returned.limit="10"It will display 10 documents. It also supportsoffsetpatterns, such aslimit="2,10"means starting from the second document and retrieving 10 items.type: List typetypeThe parameter determines the display behavior of the list. The default value islistIn this case,limitThe parameter will accurately control the number of documents returned. If set totype="page"It indicates that you want to enable the pagination feature, followed bypaginationtags to build a complete pagination interface.siteId: Multi-site callUnder the multi-site management mode of AnQi CMS, if you need to call data from other sites, you can specifysiteIdthe parameter to achieve this. In most cases, this parameter does not need to be filled in.
tagDataListThe tag will return aarchivesarray object, you need to go throughforto traverse and display each document. Eachitemobject (that is, each document in the array) contains rich field information, such as:Id(Document ID),Title(Document Title),Link(Document Link),Description(Document description),Logo(Cover main image),Thumb(thumbnail),CreatedTime(creation time),Views(Page views) and others. You can flexibly choose these fields to build the document list according to the template.
Practical demonstration: List the document list under the specified Tag.
In most cases, the most common scenario for displaying the document list under a specified tag is the tag detail page (tag/list.htmlortag_list.html) or displaying related recommendations in the sidebar or bottom area of some page.
Example 1: Displaying paginated document lists on the tag detail page
Assuming you are building a tag detail page, hoping to display all documents under the tag and support pagination.
{# 页面标题可以显示当前标签的名称 #}
<h1>标签：{% tagDetail with name="Title" %}</h1>
<p>描述：{% tagDetail with name="Description" %}</p>
<div class="document-list">
{# 使用tagDataList标签，type="page"开启分页功能 #}
{% tagDataList archives with type="page" limit="10" %}
{% for item in archives %}
<div class="document-item">
<a href="{{item.Link}}">
{% if item.Thumb %}
<img src="{{item.Thumb}}" alt="{{item.Title}}" class="document-thumbnail">
{% endif %}
<h2 class="document-title">{{item.Title}}</h2>
</a>
<p class="document-description">{{item.Description}}</p>
<div class="document-meta">
{# 获取文档所属分类的标题 #}
<span>分类：{% categoryDetail with name="Title" id=item.CategoryId %}</span>
{# 格式化文档发布时间 #}
<span>发布时间：{{stampToDate(item.CreatedTime, "2006-01-02")}}</span>
<span>浏览量：{{item.Views}}</span>
</div>
</div>
{% empty %}
<p>该标签下没有任何文档。</p>
{% endfor %}
{% endtagDataList %}
{# 引入分页导航 #}
<div class="pagination-container">
{% pagination pages with show="5" %}
<ul>
<li class="page-item {% if pages.FirstPage.IsCurrent %}active{% endif %}">
<a href="{{pages.FirstPage.Link}}">{{pages.FirstPage.Name}}</a>
</li>
{% if pages.PrevPage %}
<li class="page-item">
<a href="{{pages.PrevPage.Link}}">{{pages.PrevPage.Name}}</a>
</li>
{% endif %}
{% for pageItem in pages.Pages %}
<li class="page-item {% if pageItem.IsCurrent %}active{% endif %}">
<a href="{{pageItem.Link}}">{{pageItem.Name}}</a>
</li>
{% endfor %}
{% if pages.NextPage %}
<li class="page-item">
<a href="{{pages.NextPage.Link}}">{{pages.NextPage.Name}}</a>
</li>
{% endif %}
<li class="page-item {% if pages.LastPage.IsCurrent %}active{% endif %}">
<a href="{{pages.LastPage.Link}}">{{pages.LastPage.Name}}</a>
</li>
</ul>
{% endpagination %}
</div>
</div>
In this example,tagDataListAutomatically retrieve the current tag pagetagIdand display the documents in the form of 10 per page.paginationThe tag is responsible for rendering the complete pagination navigation. Throughitem.CategoryIdandcategoryDetailThe combination of labels, we can also display the name of the category to which each document belongs in the document list.
Example two: Display the latest documents under the specified tag in the sidebar.
If you want to display the latest 5 documents under a specific tag in a fixed area of the website, such as the sidebar, you can do this:
<div class="sidebar-block">
<h3>“Go语言”标签下的最新文档</h3>
<ul>
{# 假设标签ID为10，获取最新5篇文档 #}
{% tagDataList archives with tagId="10" order="id desc" limit="5" %}
{% for item in archives %}
<li>
<a href="{{item.Link}}">{{item.Title}}</a>
<span>({{stampToDate(item.CreatedTime, "01-02")}})</span>
</li>
{% empty %}
<li>暂无相关文档。</li>
{% endfor %}
{% endtagDataList %}
</ul>
</div>
This example shows how to specify explicitlytagIdandlimitParameters to achieve accurate content recommendation.
By flexible applicationtagDataListThe label and its parameters, you can create various forms of label document lists according to the actual needs of the website, greatly enrich the way you present content, and optimize the user's browsing experience.
Frequently Asked Questions (FAQ)
tagListandtagDataListWhat is the difference between two tags?tagListTags are mainly used to obtain the 'list of tags themselves', for example, you may want to display a cloud map of all popular tags at the bottom or in the sidebar of the website, or list all tag names on the tag homepage.It returns a series of tag objects (including tag ID, title, link, etc.). AndtagDataListThe tag is used to retrieve the document list under the specified tag, which is to say, according to one or more tags, find all the documents marked with these tags. In short,tagListThe focus is on the tag itself,tagDataListThe focus is on the document associated with the tag.How to display the classification information of each document in the tag document list?Upon passing
tagDataListWhen the tag loops through documents, eachitemAn object containsCategoryIda field, which is the ID of the document's category. You can combinecategoryDetailtags based on thisCategoryIdTo retrieve and display detailed information about the category, such as the category title or category link. The specific usage istagDataListUse within the loop,{% categoryDetail with name="Title" id=item.CategoryId %}To retrieve the category title.Can I list multiple document lists under specified tags at the same time?According to the current template tag design of Anqi CMS,
tagDataListlabel'stagIdThe parameter only supports specifying a single tag ID. If you need to list documents under multiple specific tags at the same time, it cannot be done directly through atagDataListImplement the call. Typically, you can use it multiple timestagDataListLabel, call for each label to be displayed once; or, if you have more complex aggregation requirements, you may need to develop a secondary development, perform complex query logic in the backend controller, and then pass the results to the frontend template for rendering.