How to retrieve and display detailed descriptions and associated documents for a specific tag?

In content management, tags are a powerful and flexible tool that helps us organize website content more finely, enhance user experience, and optimize search engine rankings.AnQiCMS knows this well and provides intuitive and feature-rich template tags that allow you to easily obtain and display the detailed description of a specific tag and its associated documents.

This article will deeply explore how to use these tags in the AnQiCMS template to make your website content more relevant and discoverable.

Understand the tags in AnQiCMS

In the design philosophy of AnQiCMS, tags are a form of horizontal association and complementary classification of content.Different from the traditional classification (Category) that usually uses a hierarchical structure, tags are more focused on keyword aggregation and can connect related content across different categories and even different content models.For example, an article can belong to the "news" category and be tagged with "AnQiCMS", "update", "tutorial", and other tags.

In the AnQiCMS backend management interface, you can add, edit, and manage these tags uniformly under 'Content Management' -> 'Document Tags'.Each tag can have an independent name, index letter, detailed description, even a custom URL alias and SEO information, all of which lay the foundation for the flexible display of front-end content.

Get the detailed description of a specific tag

When we want to display the detailed information of a tag itself on a website page, for example, on the tag detail page (usually corresponding totag/detail.htmlortag_detail.htmltemplate) AnQiCMS providestagDetailThe tag can help us accurately obtain various properties of a tag.

UsetagDetailwhen using tags, you can go throughid(label ID) ortokenSpecify the URL alias of the tag to retrieve information for the desired tag. If you are currently on the details page of a tag and have not specifiedidortoken,tagDetailIt will intelligently obtain the tag information on the current page.

The tag fields you can obtain include:

• Id: The unique identifier ID of the tag.
• Title: The display name of the tag, such as 'AnQiCMS Tutorial'.
• Link: The access link of the tag.
• Description: Detailed description of the tag, often used for SEO or providing more background information on the page.
• Content: If rich text content is filled in for the tag on the backend, it can be obtained through this field.
• FirstLetterThe first letter of the tag name (used for indexing).
• LogoThe thumbnail or icon of the tag.

The following is an example code snippet to retrieve the title and description of the tag:

{# 假设我们正在一个标签详情页，或者我们知道标签ID是1 #}

{# 获取标签标题 #}
<h1>{% tagDetail with name="Title" %}</h1>

{# 获取标签描述，如果描述包含HTML，需要使用 |safe 过滤器 #}
<div>
    {% tagDetail tagDescription with name="Description" %}
    {{ tagDescription|safe }}
</div>

{# 如果标签有Logo图片，可以这样显示 #}
{% tagDetail tagLogo with name="Logo" %}
{% if tagLogo %}
    <img src="{{ tagLogo }}" alt="{% tagDetail with name='Title' %}" />
{% endif %}

{# 如果标签有富文本内容，同样需要 |safe 过滤器 #}
{% tagDetail tagContent with name="Content" %}
{% if tagContent %}
    <section>{{ tagContent|safe }}</section>
{% endif %}

Please note that when the field content may contain HTML tags (such as Description or Content), it is imperative to use|safeA filter to ensure that this HTML content can be correctly parsed and displayed by the browser, rather than being output as plain text.

Get the document list associated with the tag

After displaying the detailed information of the tag, users usually expect to see all related documents (articles, products, etc.) under the tag. AnQiCMS provides this fortagDataListTags, it can retrieve all related content based on the specified tags.

tagDataListThe way of using tags andarchiveListSimilar, it will return a list of documents (or products). Its main parameters include:

• tagId: Specify the tag under which the document should be retrieved. If the current page is the detail page of a tag, this parameter is usually omitted, and the system will default to retrieving the current tag ID.
• moduleIdIf your website has multiple content models (such as articles, products), you can use this parameter to specify only the documents under a specific model, for examplemoduleId="1"Get articles,moduleId="2"Get products.
• limit: Controls the number of documents returned, for examplelimit="10"Will return up to 10 documents.
• type: Specify the type of list,"list"Used for lists without pagination,"page"Used for lists that support pagination (requires to be used withpaginationLabel配合使用）。

tagDataListIt will return an array containing document objects, you can useforLoop through these documents and extract information such as title, link, description, thumbnail, and publication time.

Here is an example of retrieving a list of documents associated with the current tag.

`twig {# Retrieve the document list associated with the current tag, display 10 per page, and support pagination #} {% tagDataList archives with type="page" limit="10" %}

{% if archives %}
    <ul class="related-docs">
        {% for item in archives %}
        <li>
            <a href="{{ item.Link }}">
                <h3>{{ item.Title }}</h3>
                {% if item.Thumb %}
                    <img src="{{ item.Thumb }}" alt="{{ item.Title }}" class="doc-thumb" />
                {% endif %}
                <p>{{ item.Description|truncatechars:100 }}</p>
                <span class="doc-info">
                    发布时间：{{ stampToDate(item.CreatedTime, "2006-01-02") }} | 
                    浏览量：{{ item.Views }}
                </span>
            </a>
        </li>
        {% endfor %}
    </ul>

    {# 关联分页标签，用于生成分页导航 #}
    {% pagination pages with show="5" %}
        <nav class="pagination-nav">
            <a href="{{ pages.FirstPage.Link }}" class="page-link {% if pages.FirstPage.IsCurrent %}active{% endif %}">首页</a>
            {% if pages.PrevPage %}<a href="{{ pages.PrevPage.Link }}" class="page-link">上一页</a>{% endif %}
            {% for p in pages.Pages %}
                <a