AnQiCMS (AnQiCMS) is an efficient and flexible content management system. Its powerful template tag system is the key to achieving personalized display for content operators and website developers. Today, we will delve into one very practical tag:{% tagList %}Especially how to巧妙地运用it cleverly utilize it to accurately obtain and display the associated tags based on the document ID. This is crucial for building a content-rich, highly associative website.

Label and content association: improve user experience and SEO

In content operation, adding 'Tags' to articles, products and other documents is a common practice.It not only helps users quickly find relevant content topics, but also provides clearer semantic information for search engines, thus optimizing the internal link structure and SEO performance of the website.The AnQi CMS is well-versed in this, providing a comprehensive tag management feature, which is reflected in its powerful template tags.

Core Function Analysis:{% tagList %}WithitemIdParameters

{% tagList %}Labels are the core tool used by AnQi CMS to list document tags.Its basic usage is to iterate through the tags of the website.tagListA key parameter of the label:itemId.

UnderstandingitemIdThe magic of

itemIdParameters are like a smart filter, it tells{% tagList %}The label only returns those tags associated with the specified document ID. Its usage is very flexible:

  1. Default behavior (current document)When you use a tag directly in a document detail page (such as an article detail page){% tagList tags %}without explicitly specifyingitemIdThe system will intelligently recognize the document ID of the current page and automatically obtain the associated tags. This is the most common and convenient usage.

  2. Explicitly specify the document IDIf you want to get the associated tags of any document in the website instead of the current page's document, you can explicitly specify the document ID in the form ofitemId="[文档ID]".itemId="10"Will get all tags associated with the document having ID 10.

  3. Get all tags (not based on document association)Although a bit off topic from today's theme, but understandingitemId="0"The role of also helps. WhenitemIdset"0"whentagListWill no longer filter based on any specific document, but return all tags on the website. This is usually used to build a tag cloud or tag index page for the entire site.

The returned data structure

When{% tagList %}After the tag is executed, it will store the list of matched tags in a variable (for example, we often name ittags）。This variable is an array object, where each element represents an independent label and includes the following key attributes for display in the template:

  • Id：The unique ID of the label.
  • Title：The display name of the label, such as “Website Operation”, “SEO Optimization”.
  • Link：The URL link of the label, clicking on it will usually jump to the document list page under the label.
  • Description：Tag description information (if set in the background).
  • FirstLetter：The first letter of the tag name (used for alphabetical sorting scenarios).
  • CategoryId：If the label is associated with a specific category (although the document tags themselves are not categorized, some special settings may exist in this field).

实战演练：按文档 ID 获取关联标签

现在，让我们通过具体的代码示例，来看看如何在不同场景下运用itemIdParameter.

Scene one: Get the associated tags of the current document

Suppose you are editing a template for an article detail page (for examplearchive/detail.html），You want to display all the tags associated with the current article at the bottom of this page. At this time, you can write the code like this:

<div class="article-tags">
    <h4>文章标签：</h4>
    {% tagList tags %} {# 在文档详情页，未指定itemId时会自动获取当前文档的标签 #}
        {% if tags %} {# 判断是否有标签存在 #}
            <ul>
            {% for item in tags %}
                <li><a href="{{ item.Link }}" title="{{ item.Title }}">{{ item.Title }}</a></li>
            {% endfor %}
            </ul>
        {% else %}
            <p>该文章暂无关联标签。</p>
        {% endif %}
    {% endtagList %}
</div>

In this code,{% tagList tags %}No explicit parameters were passeditemId，English CMS will intelligently parse it to get the associated tags of the current document, thenforloop through and display the title and link of each tag.

场景二：指定文档 ID 获取关联标签

有时，你可能需要在非文档详情页，或者在文档详情页中想获取OtherAn association tag for a specific document. For example, in a sidebar recommendation area, you want to display all the tags of a popular article (assuming ID 123).

Firstly, you need to ensure that you get the ID of the document. You can use{% archiveDetail %}the tag to get the ID of the specified document, and then pass this ID to{% tagList %}.

<div class="featured-article-tags">
    <h4>热门文章“AnQiCMS功能解析”的标签：</h4>
    {# 先获取热门文章（ID为123）的ID #}
    {% archiveDetail featuredArticle with name="Id" id="123" %}
        {% set articleId = featuredArticle %} {# 将文档ID赋值给一个变量 #}
    {% endarchiveDetail %}

    {# 再使用这个变量ID来获取关联标签 #}
    {% tagList tags with itemId=articleId %}
        {% if tags %}
            <ul>
            {% for item in tags %}
                <li><a href="{{ item.Link }}" title="{{ item.Title }}">{{ item.Title }}</a></li>
            {% endfor %}
            </ul>
        {% else %}
            <p>指定文章暂无关联标签。</p>
        {% endif %}
    {% endtagList %}
</div>

This example demonstrates how to perform chaining operations, first byarchiveDetailretrieving the ID of a specified article, then assigning that ID toarticleIda variable, finallytagListTagged throughitemId=articleIdParameters, accurately obtained all related tags of this popular article.

More application scenarios and considerations

PassitemIdparameters,{% tagList %}The flexibility of tags has been greatly enhanced. You can use this feature to achieve:

  • Enhance the association of the article page: Display related tags at the bottom of the article to guide users to browse more content of the same theme.
  • Build dynamic content blocksIn the home page or category page, display the tags of specific 'recommended articles' or 'latest products' to provide more click entries.
  • Personalized recommendations：Combining user behavior analysis, dynamically loading tags of articles that users may be interested in.
  • SEO optimizationThrough displaying related tags, increase the internal link density between pages and enhance the weight distribution of keywords.

Summary

Anqi CMS's{% tagList %}label combined withitemIdParameter, provides powerful tools for website content operation.Whether it is intelligently recognizing the current document or accurately specifying any document, it can help you efficiently obtain and display tags associated with the document.Master this skill, and you will be able to better organize website content, enhance user experience, and optimize the website's search engine performance.

Common Questions (FAQ)

  1. Q:itemIdparameter settings0What will be the effect?答：WhenitemIdparameter settings0when{% tagList %}The label will no longer be filtered based on any specific document, but will return the list of all labels on the website.This is usually used to build a tag cloud or tag index page for the entire site, rather than associated tags for specific documents.

  2. 问：Can I call tags of other categories in the article detail page?Answer: Absolutely.itemIdThe parameter only cares about the unique ID of the document, not the category to which the document belongs. Therefore, you only need to know the specific ID of the document you want to retrieve the tag from (regardless of which category it belongs to), and then use it asitemIdThe value is passed to{% tagList %}.

  3. Question: If a document does not have any associated tags,{% tagList %}What will be displayed?Answer: If a document does not have any associated tags, then{% tagList %}The variable defined by the label (e.g.,tags) it will be an empty array. In the template, you can use{% if tags %}To determine whether the label list is empty, and display "No labels" or other prompts accordingly to optimize the user experience.