As a website operator well-versed in the operation of security CMS, I fully understand the core role of content organization and user experience in the success of a website.The tags (Tags) are the important bridge connecting these two, they not only help us effectively classify and manage a vast amount of content, but also guide users to quickly find information that interests them.tagListandtagDataListThese two template tags are the key tools for achieving this goal, allowing us to flexibly display tags and associated documents under the tags on the website front end.

The aggregated display of all-site tags: usingtagListtags

tagListThe main function of tags is to obtain and display the tag list on the website. Regardless of the amount of content on your website,tagListEnglish translation: Can help you gather all tags or a set of tags with specific conditions into a clear index or popular tag cloud, greatly enhancing the navigation and content discovery of the website.

to usetagListYou need to define a variable in the template to receive label data, and cooperate withforLoop through these labels. 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 set of tag data obtained.limit="10"The parameter indicates that we want to get at most 10 tags. InforInside the loop,itemThe variable represents each tag we are currently traversing through,item.LinkGet the URL address of the tag, throughitem.TitleGet the name of the tag. When the user clicks the tag name, they will be directed to the exclusive page of the tag to view all documents related to the tag.

tagListThe label supports some practical parameters to meet more refined filtering requirements:

  • itemIdBy default, this parameter reads the current document's ID to retrieve 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：Control the number of returned tags. In addition to a single number, it also supportsoffset,countMode, for examplelimit="2,10"indicating to start from the second tag and get 10 tags.
  • letterBased on the alphabetical index (A-Z) of the tag to filter.
  • categoryIdIf you want to display tags related to a specific category only, you can specify the category ID through this parameter, which 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 worth noting that when you want to display all tags on an independent page (such as the tab homepage) and support pagination,tagListit can also be implemented withtype="page"parameters withpaginationTags intag/index.htmltemplates.

特定标签下的文档列表：使用EnglishtagDataListtags

当用户点击一个标签后，通常会期望看到与该标签相关联的所有文档。tagDataListThe label is designed for this purpose, it can retrieve and display the document list under the specified label ID, establishing a direct association between the label and the content.

tagDataListThe usage method oftagListSimilarly, 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 used to store the document list.tagId="1"Is a core parameter, it tellstagDataListWe want to get all documents under the tag with ID 1. IftagIdNot specified, the system will automatically try from the current tag page (usuallytag/list.html）of the URL is parsed out.type="page"andlimit="10"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.

tagDataListProvided rich parameters to further control document filtering and sorting:

  • tagId: Specify the tag ID of the document to be retrieved. This is the most critical parameter of this tag.
  • moduleId：If your document belongs to a different content model (such as articles, products), you can specify which model's documents to retrieve with this parameter.
  • order：Define the sorting method of the document, for exampleorder="id desc"(Sorted by ID in descending order, i.e., the most recent ones first) ororder="views desc"(Sort by view count in descending order).
  • limit: Controls the number of documents returned, also supportsoffset,countpattern.
  • type: Can be set topage(Used for pagination list) orlist(Used for fixed quantity list).
  • 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, can be used)stampToDateFormatted). These fields are witharchiveListThe tag returns consistent document fields and provides high flexibility to display document content.

In most cases,tagDataListThe tag will be used intag/list.htmlTemplate file used to display the document list under a specific tag. It is inpaginationThe collaboration of tags can easily realize the pagination function of document lists, enhancing the user experience when browsing a large amount of content.

The synergistic effect of tags and document display

In the actual operation of websites,tagListandtagDataListFrequently 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 the user clicks on one of the tags, the page will jump to the corresponding tag.tag/list.htmlpage. In this page,tagDataListIt will take effect, dynamically loading and displaying all relevant documents under the tag based on the label ID in the URL.

This mechanism not only optimizes the internal link structure of the website, but also benefits search engine optimization (SEO) a lot.Each tag page has become a content collection page with a specific theme, which helps improve the website's ranking under relevant keywords.Through 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.

Common Questions and Answers (FAQ)

1. How to create and manage tags in the AnQi CMS backend?

In the AnQi CMS backend, you can go through内容管理-文档标签Menu enters 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, and tags are not categorized by type or model, allowing them to 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 configure the URL structure of the tab page in it.功能管理-伪静态规则For example, you can set the tab homepage to/tagsor/tags-{page}Set the label document list page to English/tag-{id}(-{page})or/tag-{filename}(-{page})Even URLs with label name aliases can be defined for a more friendly URL. A reasonable URL structure is not only helpful for SEO but also enhances users' intuitive perception of page content.

3. Which template files will be used?tagListandtagDataListTags?

According to the template design conventions of Anqi CMS,tagListLabels are typically used in the common parts of a website, such as the home page sidebar, the bottom of article detail pages, or the full-site tag cloud page (tag/index.html) and are used to display a collection of tags. AndtagDataListThe label is specifically used to display the document list page under a specific label (tag/list.html) These predefined template paths help maintain the consistency and maintainability of the website structure.