How to display all tags and document lists under tags in `tagList` and `tagDataList` tags?
As an operator who deeply understands the operation of the Anqi CMS, I have a very good understanding of the core role of content organization and user experience in the success of a website.Tags are the important bridge connecting the two, they not only help us effectively classify and manage a large amount of content, but also guide users to quickly find the information they are interested in.In Anqi CMS,tagListandtagDataListThese two template tags are the key tools to achieve this goal, allowing us to flexibly display tags and associated documents on the front end of the website.
The aggregated display of tags on the entire site: usetagListTag
tagListThe main function of tags is to obtain and display the tag list on the website. No matter how large the content of your website is,tagListCan help you gather all tags or a collection of tags based on specific conditions, forming a clear index or a hot tag cloud, which greatly enhances the website's navigation and the discoverability of content.
To usetagListIn the template, you need to define a variable to receive tag data and work withforLoop through these tags. The basic usage is as follows:
{% tagList tags with limit="10" %}
{% for item in tags %}
<a href="{{item.Link}}">{{item.Title}}</a>
{% endfor %}
{% endtagList %}
In the above example,tagsis the variable name we define, which will carry fromtagListThe collection of label data obtained.limit="10"The parameter indicates that we want to get up to 10 labels.forinside the loop,itemThe variable represents each label we are traversing through, and we can access it byitem.LinkRetrieve the URL address of the tag, throughitem.TitleGet the name of the tag. When the user clicks on the tag name, they will be directed to the exclusive page of the tag to view all documents related to the tag.
tagListTags also support some practical parameters to meet more refined filtering requirements:
itemId: By default, this parameter reads the current document's ID to get the tags related to the document. If you want to display all tags without being limited by the current document, you can set it toitemId="0".limit: Controls the number of returned tags. In addition to a single number, it also supportsoffset,countpatterns, such aslimit="2,10"indicating to start from the 2nd tag and get 10 tags.letter: Filter by the letter index (A-Z) of the label.categoryIdIf you want to display tags related to a specific category only, you can specify the category ID through this parameter. It supports multiple IDs separated by commas.siteIdIn a multi-site management environment, it is used to specify which site's data to retrieve.
It is noteworthy that when you want to display all tags on an independent page (such as the tag homepage) and support paginationtagListit can also be配合type="page"Parameters andpaginationThe tag is intag/index.htmlin the template.
Documents list under a specific tag: usetagDataListTag
When a user clicks on a tag, they usually expect to see all the documents associated with that tag.tagDataListThe label is designed for this, it can retrieve and display the document list under the specified tag ID, building a direct association between the label and the content.
tagDataListthe way of use istagListSimilar, it also needs a variable to receive document data and throughforloop for rendering. Its basic structure is as follows:
{% tagDataList archives with tagId="1" type="page" limit="10" %}
{% for item in archives %}
<div>
<a href="{{item.Link}}">
<h5>{{item.Title}}</h5>
<p>{{item.Description}}</p>
<span>发布时间：{{stampToDate(item.CreatedTime, "2006-01-02")}}</span>
<span>阅读量：{{item.Views}}</span>
</a>
</div>
{% empty %}
<div>该标签下暂无文档。</div>
{% endfor %}
{% endtagDataList %}
In this example,archivesis the variable used to store the document list.tagId="1"It is a core parameter that tellstagDataListWe want to get all documents under the tag with ID 1. IftagIdNot specified, the system will automatically try to get from the current tag page (usuallytag/list.htmlParse the tag ID from the URL.type="page"andlimit="10"The parameter combination is used to implement pagination of the document list, displaying 10 documents per page. When no documents meet the conditions,{% empty %}The content within the block will be displayed.
tagDataListIt provides rich parameters to further control the filtering and sorting of documents:
tagId: Specify the tag ID to retrieve the document. This is the most critical parameter for this tag.moduleIdIf your document belongs to a different content model (such as article, product), you can specify which model's documents to retrieve through this parameter.orderDefine the sorting method of the document, for example,order="id desc"(Sorted by ID in descending order, i.e., the most recent published first) ororder="views desc"(Sorted by views in descending order).limit: Controls the number of documents returned, also supportsoffset,countPattern.type: Can be set topage(Used for pagination lists) orlist(Used for a fixed number of lists).siteIdIn a multi-site management environment, it is used to specify which site's data to retrieve.
InforIn the loop, eachitemThe variable contains various details of the document, such asitem.Id(Document ID),item.Title(Document title),item.Link(Document link),item.Description(Document description),item.Views(Document views),item.Thumb(Thumbnail),item.CreatedTime(Creation timestamp, you can usestampToDateformatting). These fields are related toarchiveListThe tag returns the document field consistently, providing high flexibility to display document content.
Generally speaking,tagDataListThe tag is used intag/list.htmlThe template file is specifically designed to display a list of documents under a specific tag. By usingpaginationThe combination of tags can easily achieve pagination of document lists, enhancing the user experience when browsing large amounts of content.
The synergistic effect of tags and document display.
In the actual operation of the website,tagListandtagDataListAlways collaborate to provide users with a smooth tag navigation experience. For example, in a sidebar or bottom area, we can usetagListDisplay popular tags or a subset of all tags. When a user clicks on one of the tags, the page will jump to the correspondingtag/list.htmlpage. In this page,tagDataListIt will take effect, dynamically loading and displaying all relevant documents under the tag ID in the URL.
This mechanism not only optimizes the internal link structure of the website, but also benefits search engine optimization (SEO) greatly.Each tag page has become a content collection page with a specific theme, which helps improve the ranking of the website under relevant keywords.By providing high-quality content and clear navigation, we can effectively attract and retain users, making it easier for them to explore the rich information of the website.
Frequently Asked Questions (FAQ)
1. How to create and manage tags on the AnQi CMS backend?
In AnQi CMS backend, you can go through内容管理-u003e文档标签Navigate to the tag management page. Here, you can add new tags, enter tag name, index letter, custom URL, SEO title, tag keywords, and tag description information.The system allows you to add multiple tags to documents, tags do not differentiate between categories and models, and can be shared between documents of different content models and categories.
2. Can the URL structure of the AnQi CMS tag page be customized?
Yes, AnQi CMS supports custom pseudo-static rules. You can功能管理-u003e伪静态规则configure the URL structure of the tab page. For example, you can set the tag homepage to/tagsor/tags-{page}Set the label document list page to/tag-{id}(-{page})or/tag-{filename}(-{page})Even a URL with label name aliases can be defined for a more friendly one. A reasonable URL structure not only helps with SEO but also improves users' intuitive perception of page content.
3. Which template files will be usedtagListandtagDataListTag?
According to the template design conventions of Anqi CMS,tagListTags are usually used in the common parts of a website, such as the homepage sidebar, the bottom of article detail pages, or the website tag cloud page (tag/index.html) to display a collection of tags. AndtagDataListThe tag is specifically used to display the document list page under a specific tag (tag/list.html) These predefined template paths help maintain the consistency and maintainability of the website structure.