How to limit the number of tags and sorting method for displaying the `tagList` tags?

Flexible control of website tags: in Anqi CMStagListThe limit of tags and sorting techniques

In a content management system, tags (Tag) are an important element that connects content, enhances user experience, and optimizes search engine crawling.AnQi CMS, as an efficient enterprise-level content management system, provides powerful tag management functions and allows developers and operators to flexibly display these tags on the frontend through its template tag system.tagListTags are the core tools to display the tag list related to the document.

However, in actual operation, we often need to control the number of display tags, such as only showing the top 10 most popular tags, or arranging them in a specific order. This article will delve into the tagListHow to implement quantity restrictions and sorting for tags, helping you to better utilize the tag function.

Get to know the AnQi CMS.tagListtags

Firstly, let's briefly review.tagListThe basic usage of tags. In the template of Anqi CMS,tagListMainly used to call tag data related to documents. Its basic structure is similar to this:

{% tagList tags with limit="10" %}
    {% for item in tags %}
        <a href="{{item.Link}}">{{item.Title}}</a>
    {% endfor %}
{% endtagList %}

The purpose of this code is to get the tag list and assign it totagsthe variable, then loop through ittagsto display the title and link of each tag. It can be seen that there is a tag namedlimitThe parameter is indeed listed, which is the key to controlling the number of items.

Precisely control the number of tags:limitThe clever use of parameters

tagListTagged throughlimitThis parameter provides very flexible control over the number of tags. This parameter allows you to specify the number of tags you want to display, or to implement more advanced offset display.

1. Limit the total number displayed

The most common usage is to limit the total number of tags in a list. If you only want to display, for example, 'The latest 10 tags' or 'The most frequently used 20 tags' on a page, you can simply setlimitThe parameter should be an integer value.

For example, to display 10 tags, you can set it like this:

{% tagList tags with limit="10" %}
    {# 此处将展示最多10个标签 #}
    {% for item in tags %}
        <a href="{{item.Link}}">{{item.Title}}</a>
    {% endfor %}
{% endtagList %}

Anqi CMS'slimitThe parameter supports integer values between 1 and 100. If it exceeds this range, the system may use a default value or exhibit unexpected behavior, so it is recommended to set it within this range.

2. Implement pagination or skip a specific number of items

limitParameters also support a "offset" mode, which is very useful when you need to skip the first few tags or to achieve a more refined "pseudo-pagination" effect. The format is"offset,count", meaning from theoffsetAn tag begins (the index starts from 0 or 1, depending on the system's internal implementation, usually 0 or 1), acquisitioncounttags.

For example, if you want to skip the first 2 tags, start displaying from the 3rd tag, and get the next 5 tags, you can set it like this:

{% tagList tags with limit="2,5" %}
    {# 此处将从第3个标签开始，展示5个标签 #}
    {% for item in tags %}
        <a href="{{item.Link}}">{{item.Title}}</a>
    {% endfor %}
{% endtagList %}

This pattern is very practical in certain specific UI design or content recommendation scenarios, allowing you to precisely control which tags appear in different areas of the page.

Explore the sorting method of tags: optimize the display order

Compared to directly limiting the number, the sorting method of tags intagListThere is no explicit parameter in the tagsorderThis is different fromarchiveListThe document list labels vary,archiveListprovided,order="id desc|views desc"and other explicit sorting options. FortagList, its sorting behavior mainly depends on the system default logic and indirect influence through filtering parameters.

1. Default sorting behavior

Of Anqy CMS, when no other filtering or sorting conditions are specified,tagListTags are usually sorted by the creation time (ID) of the tag, with the latest tags possibly appearing at the front, or arranged according to the default weight or popularity maintained internally by the system.This default behavior is sufficient for most dynamic tag display.

2. Byletterparameters for filtering (indirect sorting)

tagListit provides aletterParameters, allowing you to filter by the first letter of the tag.Although this is not a direct sorting function, it can effectively limit the tag list to tags that start with a specific letter, thus visually creating an 'alphabetically grouped' effect.

For example, if you only want to display tags that start with the letter "A", you can use it like this:

{% tagList tags with limit="10", letter="A" %}
    {# 此处将展示最多10个以"A"开头的标签 #}
    {% for item in tags %}
        <a href="{{item.Link}}">{{item.Title}}</a>
    {% endfor %}
{% endtagList %}

By combininglimitandletterYou can implement the requirement of 'Display up to 10 tags starting with 'A'.'

3. Post-processing at the template level (front-end sorting)

If the built-in of Anqi CMStagListThe parameter cannot meet your strict requirements for specific sorting (such as requiring all tags to be sorted in ascending or descending alphabetical order by title), you may need to perform front-end sorting using JavaScript at the template level after obtaining the tag data, or a better approach is to handle the sorting in advance in the backend business logic. However, for most operational scenarios, the default behavior of Anqi CMS plusletterThe filter already meets the basic display requirements.

Application scenarios and code examples

Assuming we want to display 5 of the most popular tags in the sidebar, which are not exclusive to the current document but are the site-wide popular tags, and also, if we want to show a list of tags starting with 'C'.

Scene one: Display the top 5 most popular tags in the entire stationDue totagListThere is no clear "popularity" sorting parameter here; we assume that the system defaults or can obtain a weighted sorting of tags through other configurations (such as backend configurations). To display tags across the entire site without being limited by the current document, the setting needs to be adjusted.itemId="0".

<div class="sidebar-tags">
    <h3>热门标签</h3>
    <ul>
        {% tagList hotTags with limit="5", itemId="0" %}
            {% for tag in hotTags %}
                <li><a href="{{tag.Link}}">{{tag.Title}}</a></li>
            {% empty %}
                <li>暂无热门标签。</li>
            {% endfor %}
        {% endtagList %}
    </ul>
</div>

Scene two: Display 10 tags starting with 'C'

<div class="category-c-tags">
    <h3>以“C”开头的标签</h3>
    <ul>
        {% tagList cTags with limit="10", letter="C" %}
            {% for tag in cTags %}
                <li><a href="{{tag.Link}}">{{tag.Title}}</a></li>
            {% empty %}
                <li>暂无以“C”开头的标签。</li>
            {% endfor %}
        {% endtagList %}
    </ul>
</div>

By these flexible parameter combinations, you can customize the display of tag lists in the Anqi CMS according to different design and operational requirements, thus enhancing the organization of website content and the user experience.

Summary

Anqi CMS'stagListTags are a powerful tool for managing and displaying website tags. By using them flexibly,limitParameters, you can easily control the number of displayed tags, whether it is a fixed number or a selection with an offset. Although it does not provide a directorderParameters can be customized sorted, but you can also utilizeletterParameters are filtered, or rely on the system's default sorting logic to meet most needs.Understanding and mastering these skills will make your website's tag layout smarter and more efficient, providing a better browsing experience for users.

---

Common Questions (FAQ)

1. IftagListThere are no explicit sorting parameters, how can I sort by the alphabetical order of the tag title (A-Z)?Answer: BecausetagListThe tag itself does not provide directorderParameters are used for custom sorting, which usually follows the creation ID of the tag or the default weight built into the system. To sort strictly by the alphabetical order of the tag title, this is usually required in the Anqi CMS