How to use the `tagDetail` tag to get the detailed information of a Tag, such as description and link?

In Anqi CMS, tags are an important tool for organizing content, improving SEO, and enhancing user experience.Sometimes, we need not only to list tags, but also to display detailed information about a specific tag on the page, such as its description, link, and even Logo.at this time,tagDetailThe label comes in handy, it helps us easily obtain this data.

tagDetailLabel overview

tagDetailThe primary function of the tag is to obtain detailed information of a single Tag tag. Whether it is on the detail page of the tag itself, the list page, or the document detail page where you want to display detailed data associated with a tag,tagDetailAll can provide flexible calling methods. Its basic usage form is as follows:

{% tagDetail 变量名称 with name="字段名称" id="标签ID" %}

Among them:

  • 变量名称Is an optional parameter, if you want to store the value obtained in a variable for subsequent repeated use, you can specify. If not specified,tagDetailwill output the result directly.
  • name="字段名称"It is crucial, it specifies the specific attribute of the Tag tag you want to obtain, such as title, link, description, etc.
  • id="标签ID"ortoken="标签URL别名"It is also an optional parameter. If the page you are currently on is the page of the Tag tag (for example, the tag detail page), thentagDetailIt will default to fetching the Tag information of the current page, no need to specifyidortoken. But if you want to fetchnot the current pagethe Tag information of a specific page, you can do so byid（Tag's unique numeric ID）ortokento specify the Tag's URL alias precisely.
  • siteIdThe parameter is used for multi-site scenarios, if you manage multiple sites and want to call data from other sites, you can specify the site ID through this parameter.In most cases, you do not need to worry about this parameter.

Let's take a look atnameThe parameter can retrieve which common tag information.

Detailed field analysis and application

tagDetailTag throughnameThe parameter can retrieve a series of fields related to Tag. Understanding these fields and how to call them gives you greater freedom in template design.

1. Tag ID (Id)

This is a unique numeric identifier for each tag.

{# 获取当前页面的Tag ID #}
<div>当前标签ID：{% tagDetail with name="Id" %}</div>

{# 获取指定ID为1的Tag ID #}
<div>指定标签ID：{% tagDetail with name="Id" id="1" %}</div>

{# 将Tag ID存储到变量中 #}
{% tagDetail myTagId with name="Id" %}
<div>我的标签ID是：{{ myTagId }}</div>

2. Tag Title (Title)

It is usually the display name of the tag and one of the most commonly used pieces of information.

{# 获取当前页面的Tag标题 #}
<h2>{% tagDetail with name="Title" %}</h2>

{# 获取指定ID为1的Tag标题 #}
<div>标签名称：{% tagDetail with name="Title" id="1" %}</div>

{# 将Tag标题存储到变量中 #}
{% tagDetail currentTagTitle with name="Title" %}
<h1>{{ currentTagTitle }}</h1>

3. Tag Link (Link)

This is the URL address of the tag detail page, convenient for users to click and jump to the list of all content related to the tag.

{# 获取当前页面的Tag链接 #}
<p>查看更多相关内容：<a href="{% tagDetail with name="Link" %}">点击这里</a></p>

{# 获取指定ID为1的Tag链接 #}
<a href="{% tagDetail with name="Link" id="1" %}">查看指定标签内容</a>

{# 将Tag链接存储到变量中 #}
{% tagDetail tagUrl with name="Link" %}
<a href="{{ tagUrl }}">进入标签页面</a>

4. Tag Description (Description)

Used to briefly introduce the purpose or content of the label, which is helpful for SEO and user understanding.

{# 获取当前页面的Tag描述 #}
<p>标签简介：{% tagDetail with name="Description" %}</p>

{# 获取指定ID为1的Tag描述 #}
<div>这是一个关于：{% tagDetail with name="Description" id="1" %}</div>

{# 将Tag描述存储到变量中 #}
{% tagDetail tagIntro with name="Description" %}
<p>{{ tagIntro }}</p>

5. Index letter (FirstLetter)

If the label name is English, this field will return the first letter (uppercase) for easy alphabetical classification display.

{# 获取当前页面的Tag首字母 #}
<span>标签首字母：{% tagDetail with name="FirstLetter" %}</span>

6. Label image (Logo)

If the background has set a thumbnail or Logo for the tag, you can get the image link through this field.

{# 获取当前页面的Tag Logo #}
<img src="{% tagDetail with name="Logo" %}" alt="{% tagDetail with name="Title" %}" />

{# 获取指定ID为1的Tag Logo #}
<img src="{% tagDetail with name="Logo" id="1" %}" alt="{% tagDetail with name="Title" id="1" %}" />

7. Tag content (Content)

This field can store more detailed label introduction or relevant information, usually in rich text (HTML) or Markdown format.

{# 获取当前页面的Tag内容，注意使用 |safe 过滤器防止HTML被转义 #}
<div class="tag-full-content">{% tagDetail with name="Content" render=true %|safe}</div>

{# 获取指定ID为1的Tag内容，并存储到变量中 #}
{% tagDetail specificTagContent with name="Content" id="1" render=true %}
<div class="specific-tag-details">{{ specificTagContent|safe }}</div>

Please note that whenContentIt is recommended to use|safeA filter to ensure that the content can be correctly parsed by the browser rather than displayed as plain text. If your backend has enabled the Markdown editor and the Content is in Markdown format, you will also need to addrender=trueParameter, let the system convert it to HTML before outputting.

Actual application example

Assuming you are building a tag list page for Anqi CMS, or in the sidebar of a document detail page, you need to display the detailed information of the current document's tags.

Scene one: Display the current tag's details on the tag detail page

Intemplate/你的模板目录/tag/detail.htmlortag/list.html(If configured as Tag detail page), you can call it like this:

<div class="tag-header">
    <h1>{% tagDetail with name="Title" %}</h1>
    <p class="tag-description">{% tagDetail with name="Description" %}</p>
    {% tagDetail tagLogo with name="Logo" %}
    {% if tagLogo %}
        <img src="{{ tagLogo }}" alt="{% tagDetail with name="Title" %}" class="tag-logo">
    {% endif %}
    <div class="tag-content">
        {% tagDetail tagFullContent with name="Content" render=true %}
        {{ tagFullContent|safe }}
    </div>
    <a href="{% tagDetail with name="Link" %}" class="btn btn-primary">查看所有关联内容</a>
</div>

This example shows how to directly retrieve and present the title, description, Logo, and detailed content of a tag on its dedicated page, while also providing a button linking back to itself.

Frequently Asked Questions (FAQ)

  1. Question:tagDetailThe label defaults to retrieving information for which Tag?Answer: If you do not provideidortokenparameter,tagDetailThe tag will intelligently try to retrieve the Tag information associated with the current page.For example, on the Tag detail page (the URL includes Tag ID or alias), it will automatically identify and display the data of the current Tag.In the document detail page, if the current document is associated with a Tag,tagDetail won'tThe system automatically retrieves the Tag information of the current document, you need totagListRetrieve the list of tags before calling it in a looptagDetailOr throughtagDetailofidSpecify the parameter.

  2. How can I display the details of a specific Tag associated with the current document on the document detail page?Firstly, you need to use in the document detail page,tagListUse the tag to get the list of all Tags associated with the current document. Then, you can iterate over this list and use each TagtagDetailtags, throughtagDetailofidparameter (passing initem.Id）to get the specific information of each Tag.

  3. Question:DescriptionandContentfields?Answer:DescriptionIt is usually used to store brief tag descriptions, with fewer words, mainly used for list display, SEO metadata（<meta name="description">）and other scenarios.ContentThe field can store more detailed and rich text and image content, possibly containing HTML or Markdown format, used as the main text on the tag detail page. When callingContentWhen a field contains HTML or Markdown, it must be used|safefilter, and Markdown content should be added withrender=trueParameter, to ensure that the content is parsed and displayed correctly.