As an experienced CMS website operation personnel in the information security field, I am well aware of the important role that content tags (Tags) play in website content management and SEO optimization.They can not only help us organize content more flexibly and enhance user experience, but are also one of the key factors for search engines to understand the structure of website content.Today, I will delve into how to retrieve and display detailed information of specific tags in the Anqi CMS template, including tag name, description, index letter, and Logo, to achieve a more refined front-end presentation.
Understand the Tag (Tag) in AnQi CMS
In AnQi CMS, a tag is a powerful and flexible content association tool.Tags are not divided by models and levels, a tag can be applied to documents of different content models at the same time.For example, an "AnQi CMS tutorial" article and a "website service" product can both be tagged as "SEO".This makes the horizontal association between content more tight, providing users with multi-dimensional content discovery paths.
AnQi CMS stores rich metadata for each tag to facilitate diversified display on the frontend. These core pieces of information include:
- Label Name (Title): User-visible label name.
- Label Description (Description): Brief description of the label content, helpful for SEO.
- 索引字母（FirstLetter）：通常是标签名称的首字母，用于按字母排序或导航。
- Custom URL：用于伪静态和URL优化。
- SEO Title and Keywords: Further optimize the tag page's search engine performance.
- Tag Logo/Image: Provide a visual identifier for the tag.
Get detailed information of a single tag:tagDetailtags
When we need to display label details on a page (such as/tag/SEO.html) or any place that requires displaying specific label details, tagDetailTemplate tags are our preferred tool. It helps us accurately obtain the properties of specified tags.
tagDetailThe way to use tags is{% tagDetail 变量名称 with name="字段名称" id="1" %}.变量名称Can be omitted; if omitted, the field value will be output directly; if a variable name is specified, the obtained value can be stored in the variable for subsequent use.
tagDetailSupport the following main parameters to specify the target tag:
idSpecify through the unique ID of the tag.tokenSpecify through the URL alias (custom URL) of the tag.siteIdIn a multi-site environment, if you need to retrieve data from other sites, you can specify the site ID.
The following is a specific example of obtaining detailed information about the label.
Get the label name (Title)
PassTitleField, we can get the user-friendly name of the label.
{# 默认用法，自动获取当前页面Tag的名称 #}
<div>标签名称：{% tagDetail with name="Title" %}</div>
{# 获取ID为1的标签名称 #}
<div>标签名称：{% tagDetail with name="Title" id="1" %}</div>
{# 将标签名称赋值给变量并使用 #}
{% tagDetail tagName with name="Title" %}
<div>当前标签名为：{{tagName}}</div>
Get the label description (Description)
DescriptionField used to obtain the detailed introduction of tags, which is crucial for enriching the content of the tag page and SEO.
{# 默认用法，自动获取当前页面Tag的描述 #}
<div>标签描述：{% tagDetail with name="Description" %}</div>
{# 获取URL别名为"golang"的标签描述 #}
<div>标签描述：{% tagDetail with name="Description" token="golang" %}</div>
{# 将标签描述赋值给变量并使用 #}
{% tagDetail tagDescription with name="Description" %}
<div>当前标签描述为：{{tagDescription}}</div>
Get the index letter (FirstLetter) of the tag
FirstLetterField can get the first letter of the tag name, commonly used for sorting the tag list in alphabetical order.
{# 默认用法，自动获取当前页面Tag的索引字母 #}
<div>标签索引字母：{% tagDetail with name="FirstLetter" %}</div>
{# 获取ID为5的标签索引字母 #}
<div>标签索引字母：{% tagDetail with name="FirstLetter" id="5" %}</div>
{# 将索引字母赋值给变量并使用 #}
{% tagDetail tagInitial with name="FirstLetter" %}
<div>当前标签首字母为：{{tagInitial}}</div>
Get the Logo/image (Logo) of the tag
If the tag is configured with a Logo or thumbnail, we can useLogothe field to obtain its image URL, for visual display.
{# 默认用法，自动获取当前页面Tag的Logo #}
<div>标签Logo：<img src="{% tagDetail with name="Logo" %}" alt="{% tagDetail with name="Title" %}" /></div>
{# 获取URL别名为"anqicms"的标签Logo #}
<div>标签Logo：<img src="{% tagDetail with name="Logo" token="anqicms" %}" alt="安企CMS标签" /></div>
{# 将Logo地址赋值给变量并使用 #}
{% tagDetail tagLogo with name="Logo" %}
<div>当前标签Logo：<img src="{{tagLogo}}" alt="标签图片" /></div>
to get the tag list information:tagListtags
In addition to getting the details of a single tag, we often need to display a list of tags, such as showing related tags at the bottom of the article detail page or displaying popular tags in the sidebar.tagListLabels are designed for this purpose.
tagListThe way to use tags is{% tagList 变量名 with limit="10" %}It will return an array of labels, and we need to go throughfora loop to traverse and display the detailed information of each label.
tagListSupport the following main parameters to filter and sort tags:
itemId: Specify the document ID to get the tags associated with the document. If not specified, the ID of the current document is read by default; if set to0If so, do not read the current document ID, used to get all tags.limit: Limit the number of returned tags.letter: Filter by index letters (A-Z).categoryIdEnglish: Filter by category ID to get tags associated with the documents under the category.siteIdIn a multi-site environment, if you need to retrieve data from other sites, you can specify the site ID.
IntagListofforin the loop, eachitemincludesId/Title/Link/DescriptionandFirstLetterand other fields.
English: Display related tags on the article detail page.
<div>
<h4>本文相关标签：</h4>
{% tagList tags with itemId=archive.Id limit="10" %}
{% for item in tags %}
<a href="{{item.Link}}" class="tag-item">{{item.Title}}</a>
{% endfor %}
{% endtagList %}
</div>
Example: Display all tags and sort them alphabetically by index (pseudo-code, needs further implementation by the frontend for alphabetical classification)
<div class="tag-cloud">
{% tagList allTags with limit="50" %} {# 获取前50个标签 #}
{% for item in allTags %}
<a href="{{item.Link}}" title="{{item.Description}}">{{item.Title}} ({{item.FirstLetter}})</a>
{% endfor %}
{% endtagList %}
</div>
Tag document list:tagDataListtags
Although this does not directly obtain the detailed information of the tag itself, it is worth mentioning for the completeness of the contenttagDataListTag. It is used to retrieve the list of all documents under a specified tag, usually on the tag details page (such as/tag/SEO.html)，combined with pagination features to display all content related to the tag.
{# 假设在标签详情页，会自动获取当前TagID #}
<div>
<h3>标签“{% tagDetail with name="Title" %}”下的文章：</h3>
{% tagDataList archives with type="page" limit="10" %}
{% for item in archives %}
<div class="archive-item">
<a href="{{item.Link}}">
<h4>{{item.Title}}</h4>
<p>{{item.Description}}</p>
</a>
<span>发布于：{{stampToDate(item.CreatedTime, "2006-01-02")}}</span>
</div>
{% empty %}
<p>该标签下暂无内容。</p>
{% endfor %}
{% endtagDataList %}
{# 结合分页标签 #}
{% pagination pages with show="5" %}
{# 分页HTML结构 #}
{% endpagination %}
</div>
The application in practice and **practice
- Tab page optimization: Utilizing
tagDetailRetrieved label name, description, Logo and other information, can generate a rich, exclusive page for each label, enhancing user experience and search engine optimization. For example, on the label page,titleandmeta descriptionInserting tags dynamicallyTitleandDescription. - Content associationIn article or product detail pages, use
tagListDisplay related tags to guide users to discover more content of the same theme, and reduce the bounce rate. - Sidebar/bottom recommendation: Through
tagListCombinelimitParameters, displayed in the website sidebar or footer, showing popular or latest tags, which helps to enhance the internal link structure of the website and is beneficial for SEO. - Maintain data consistencyThe logo or image of the tag should be uploaded and maintained in the background 'Document Tag Management', ensuring that the image called by the front-end is the latest and correct.
By flexibly using these tags provided by the security CMS, we can achieve rich display of tag information and intelligent association between content with the least amount of work, thereby optimizing the website's content structure, enhancing user satisfaction, and improving search engine rankings.
Common Questions and Answers (FAQ)
1. I used it in the templatetagDetailbut it did not display any information, why is that?
Firstly, please make sure that the page you are currently visiting is indeed a tag detail page, or you are intagDetailTags throughidortokenThe parameter specified an existing tag ID or URL alias. If the tag ID or URL alias does not exist, or there is no available tag information in the current page context,tagDetailThe label will not be able to retrieve data. Also, checknamewhether the attribute is spelled correctly, for exampleTitleInsteadtitle.
2. How totagListwhether only the tags associated with documents under a specific category are displayed?
You can usetagListTagscategoryIdParameters can be used to achieve this. For example, if you want to display the tags associated with the articles of category ID 10, you can write it like this:{% tagList tags with categoryId="10" limit="10" %}. This will filter out the tags associated with the documents under the category.
3. I uploaded the logo image of the tags, but it did not display on the front end. How should I check it?
Please first confirm whether the Logo field of the tag has been correctly uploaded and saved in the "Document Tag Management" section of the Anqi CMS backend. Next, check the call in your template.LogoThe code of the field is correct, for example,{% tagDetail with name="Logo" %}.Finally, ensure that the Logo image file itself is accessible and not affected by CDN or browser caching issues. You can try clearing the website and browser caches.