In website operation, how to enable users to find the content they are interested in more efficiently, while also enhancing the visibility of the content, is a problem we often ponder.The detail page of an article or product, in addition to the core content, provides a list of relevant Tag tags, which is undoubtedly a good method to achieve this goal.AnQiCMS as a flexible and efficient content management system provides an intuitive and powerful Tag label function, allowing you to easily display these related information on the detail page.

Understand the Tag tag function of AnQiCMS

In AnQiCMS backend, adding Tag labels to articles or products is very intuitive.When you edit or publish content, in the 'Tag Tag' section, you can either select existing tags or enter a new tag and press the Enter key to add.These tags act as index keywords for content, not only helping you better organize and classify content, but also providing users with another path to explore the website's content.For example, an article about “AnQiCMS deployment”, you can add tags such as “AnQiCMS”, “deployment”, “Go language CMS”.The user can directly click the tag if interested in "Go language CMS

On the detail page, call the related Tag tag list

To be on the article or product detail page (usually){模型table}/detail.htmlTemplate file) shows these associated Tags, AnQiCMS provides a specialtagListLabel. This label is very intelligent, when used in the detail page, it will default to getting the current article or product ID asitemId. Therefore, in most cases, you do not need to manually specify this parameter.

The basic usage is as follows:

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

Here,tagsThis is a variable name defined for the tag list, you can change it according to your preference.tagListThe tag will get all Tags related to the current content andforLoop through and output. Inside the loop,item.Linkthe link address of Tag will be output,item.TitleThen output the name of the Tag.Users can click on these links and be redirected to the list page of the aggregated Tag, where they can see all articles or products tagged with that Tag. This greatly enhances the relevance of the content and the depth of users' browsing.

If you want to limit the number of displayed Tags, you can uselimitParameters. For example, to display up to 5 tags at most, you can write it like this:

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

So, even if an article is associated with ten or more Tags, only the first 5 will be displayed on the page to keep it simple.

Combined with practice: a complete code example

We are editing a template for an article detail page, and we want to display related Tag tags below the article title, publication date, and other information.

<article class="article-detail">
    {# 显示文章标题 #}
    <h1>{{ archive.Title }}</h1>

    <div class="article-meta">
        {# 显示发布日期和浏览量 #}
        <span>发布日期：{{ stampToDate(archive.CreatedTime, "2006-01-02") }}</span>
        <span>浏览量：{{ archive.Views }}</span>

        {# 调用当前文章的所有相关Tag标签 #}
        <div class="article-tags">
            <strong>相关Tags:</strong>
            {% tagList articleTags with limit="10" %} {# 限制最多显示10个Tag #}
                {% for item in articleTags %}
                    <a href="{{ item.Link }}" class="tag-item">{{ item.Title }}</a>
                {% endfor %}
            {% endtagList %}
        </div>
    </div>

    {# 显示文章主要内容，注意使用|safe过滤器确保HTML内容正确解析 #}
    <div class="article-content">
        {{ archive.Content|safe }}
    </div>

    {# 这里可以继续添加上一篇/下一篇、相关文章推荐等内容 #}
</article>

In this example,archive.Title/archive.CreatedTime/archive.Viewsandarchive.ContentAll are fields that are directly available in the article detail page template. We havetagListplaced the tags indiv, using<strong>tags to explicitly indicate that these are “related Tags”, and then iterate overarticleTagsVariables, generate a clickable link for each Tag.

Attention Points and **Practice

  1. Number of Tags moderate:Avoid stacking too many Tags on the detail page.Too many tags not only affect the beauty of the page, but may also distract the user's attention, and even be misjudged by search engines as over-optimization.It is generally recommended that each content has 5-10 Tags.
  2. Tag names concise and relevant:The name of the tag should accurately reflect the core theme of the content and be as concise and clear as possible. This is convenient for users to understand and also beneficial for SEO.
  3. Regularly check and maintain the Tag:With the growth of website content, duplicate, outdated, or irrelevant Tags may occur. Regularly cleaning and merging Tags can maintain the clarity and vitality of the website content structure.
  4. [en] Style beautification:Ensure that the style of the Tag list is consistent with the overall design style of the website, making them look like part of the content rather than an abrupt presence.For example, add a background color, rounded corners, or different font sizes to Tag links to enhance the visual effects.

By following these steps, AnQiCMS allows you to easily display a list of related Tag tags on the content detail page.This not only adds an effective navigation dimension to your website content, but also greatly optimizes the user experience and the understanding of the website content by search engines, thereby improving the overall operation effect of the website.

Common Questions (FAQ)

1. English tag how affects the website's SEO?The impact of Tag tags on SEO is mainly reflected in the following aspects: Firstly, it provides more keyword signals to search engines, helping search engines better understand the page theme.Next, each Tag page will aggregate relevant content, form internal links, enhance the website's link structure, and help improve page authority.Finally, a well-configured Tag can enhance user experience, increase the time users spend on the website, and indirectly send positive signals to search engines.

2. Can I limit the number of English tag displays on the detail page?Of course you can. IntagListIn English tags, you can uselimitThe parameter is used to specify the maximum number of Tag tags to be displayed. For example,{% tagList tags with limit="5" %}Only the first 5 Tag tags associated with the current article or product will be displayed.

3. How can I display a list of articles under a specific Tag on non-article/product detail pages?If you want to display a specific Tag