Manage and display content in AnQi CMS, Tag is undoubtedly a very practical tool.It can help us organize documents more flexibly, achieve multi-dimensional content aggregation, and is greatly beneficial for improving the SEO performance and user experience of the website.tagDataListTags are the indispensable tools we need.
标签(Tag)的妙用与EnglishtagDataList的核心功能
In daily website operations, we often need to classify and archive content.Categories are typically hierarchical, while tags provide a flat, thematic association method.For example, an article about "AnQi CMS tutorial" can belong to the "Technical ArticlesWhen the user clicks the "Go language" tag, they expect to see all documents related to Go language, regardless of which main category they belong to.tagDataList标签正是为了满足这一需求而设计的,它能够精确地根据指定的标签,提取并展示所有与之关联的文档English
UsetagDataListThe label is very intuitive. Its basic syntax structure is{% tagDataList 变量名称 with tagId="1" %}Here,变量名称It is a name you define, used to access the obtained document data in subsequent loops.tagIdThe parameter is the core, it tells the system which document list under which tag you want to get. This ID can be found on the "Document Tag" management page of the Anqi CMS backend.
Flexible configuration, precise retrieval of document lists
tagDataListTags provide various parameters, allowing you to control the retrieval and display of document lists more finely:
tagIdAs mentioned previously, this is a key parameter of the specified tag ID. If you are currently on a tag detail page (for exampletag/list.htmlortag/index.htmltemplate), and omittedtagIdparameters,tagDataListAutomatically identifies the current page's tag ID and retrieves the document under it.This greatly simplifies the template development of tabs.tagId="X", where X is the numeric ID of the tag.}moduleId:Security CMS supports various content models (such as articles, products). If you only want to display documents under a specific content model, you can usemoduleIdparameter for filtering. For example,moduleId="1"Can only retrieve documents under the article model.order: The sorting method of documents can also be flexibly controlled. You can sort by document ID (id descorid asc), and page views (views desc), or a custom sorting set by the backend (sort descSort the document to meet different display requirements.limitThis parameter is used to control the number of documents displayed. For examplelimit="10"It will display the latest 10 documents. It also supports more advanced "offset" modes, such aslimit="2,10"This indicates starting from the 2nd document and fetching 10 data entries, which is very useful in some special layouts.type: When you need to add pagination functionality to the document list,type="page"It is your choice; if you just want to list a fixed number of documents,type="list"it is more appropriate. After choosingtype="page"you also need to coordinatepaginationtags to achieve the pagination effect together.siteId:For the CMS that has enabled the multi-site function, if you need to call documents under a specific tag across sites, you can do so by settingsiteIdparameters.
Traversal of documents to display rich information
When you usetagDataListLabel gets the document list after, usually needs to be matched withforLoop through these documents, and display their information one by one. Inside the loop, each document can be accessed through a custom variable (such as the one mentioned above,archivesofitem)to access its properties.
These available document properties are very rich, including:
Id: The unique ID of the document.Title: Document title.Link: The link to the document's detail page, which can be used directly to create hyperlinks.Description:Document's brief description or summary.Logo:Document's cover image address.Thumb:Document's cover thumbnail address.CreatedTime:Document's publish time (timestamp format), usually need to be combined withstampToDateFilter performs formatting display, for example{{stampToDate(item.CreatedTime, "2006-01-02")}}.ViewsThe number of views of the document.Category: Complete information of the document's category, including category ID, title, link, etc.- Custom fields:If you define additional custom fields for documents in the background content model, you can also access and display them directly.
{{item.您的自定义字段名}}to access and display them directly.
By combining pagination, optimizing the user experience.
If the number of documents under the label is large, to avoid the page from being too long, it is usually necessary to use pagination. WhentagDataListoftypeparameter settingspageWhen, it will return an object containing pagination information. At this time, we can immediately usepaginationtags to generate pagination navigation.
For example, a typical list of label documents showing the code structure is as follows:
<div class="tag-documents-list">
{# 使用tagDataList获取指定标签下的文档列表,并开启分页功能 #}
{% tagDataList archives with type="page" limit="10" %}
{% for item in archives %}
<div class="document-item">
<a href="{{ item.Link }}">
<h3>{{ item.Title }}</h3>
{% if item.Thumb %}
<img src="{{ item.Thumb }}" alt="{{ item.Title }}" class="document-thumb">
{% endif %}
<p>{{ item.Description }}</p>
</a>
<div class="document-meta">
<span>发布时间:{{ stampToDate(item.CreatedTime, "2006-01-02") }}</span>
<span>浏览量:{{ item.Views }}</span>
<span>分类:{% categoryDetail with name="Title" id=item.CategoryId %}</span>
</div>
</div>
{% empty %}
<p>当前标签下暂无文档。</p>
{% endfor %}
{% endtagDataList %}
{# 分页导航区域,仅当type="page"时有效 #}
<div class="pagination-nav">
{% pagination pages with show="5" %}
<ul>
{# 首页链接 #}
<li {% if pages.FirstPage.IsCurrent %}class="active"{% endif %}><a href="{{ pages.FirstPage.Link }}">{{ pages.FirstPage.Name }}</a></li>
{# 上一页链接 #}
{% if pages.PrevPage %}
<li><a href="{{ pages.PrevPage.Link }}">{{ pages.PrevPage.Name }}</a></li>
{% endif %}
{# 中间页码链接 #}
{% for pageItem in pages.Pages %}
<li {% if pageItem.IsCurrent %}class="active"{% endif %}><a href="{{ pageItem.Link }}">{{ pageItem.Name }}</a></li>
{% endfor %}
{# 下一页链接 #}
{% if pages.NextPage %}
<li><a href="{{ pages.NextPage.Link }}">{{ pages.NextPage.Name }}</a></li>
{% endif %}
{# 尾页链接 #}
<li {% if pages.LastPage.IsCurrent %}class="active"{% endif %}><a href="{{ pages.LastPage.Link }}">{{ pages.LastPage.Name }}</a></li>
</ul>
{% endpagination %}
</div>
</div>
From the above examples, we can see,tagDataListThe tag is not only powerful but also very flexible in use.It can meet all kinds of needs from simple lists to complex pagination display, helping us efficiently build content aggregation pages based on tags, thus optimizing the website's content structure and user browsing experience.
Common Questions (FAQ)
1.tagDataListandarchiveListWhat is the difference between these tags? When should I use them?
tagDataListMainly used to obtain the document list associated with a specific "tag". Its core is based ontagIdTo filter content, it is very suitable for use on tag detail pages or in areas where it is necessary to display aggregated content of a specific tag.archiveListis a more general document list tag, which can be accessed in various ways (such ascategoryIdcategory ID,moduleIdmodel ID,flagrecommendation properties,userIdauthor ID,qSearch keywords and the like to filter documents. You can think of it as the '万能钥匙' to obtain a list of documents.archiveListas the '万能钥匙' to obtain a list of documents.tagDataListIt is a more professional tool specifically for the "label" dimension. On the label page, it is recommended to use it firsttagDataListbecause it is more logical and can better cooperate with the specific routing of labels.
2. In the tag detail page of Anqi CMS, how totagDataListautomatically recognize the ID of the current tag without manual specificationtagId?
This is a very convenient feature. When you are on the tag detail page of Anqi CMS (for example, in your template directory),tag/list.htmlortag/index.htmlfile) usingtagDataListWhen labeling, if omittedtagIdParameters, the system will intelligently automatically detect and use the tag ID corresponding to the current page URL to obtain the document list. This means that you usually only need to write{% tagDataList archives with type="page" limit="10" %}English: It can be done automatically, without manual search and hard codingtagId. Only when you want to display a specific tag's documents on a non-tag detail page, or when you want toOtherspecifically specify the tag's documentstagId="X".
3. How totagDataListIn the loop, display the custom field of the document?
IntagDataListIn the loop, you canitemThe variable directly accesses all default fields and custom fields of the document. If your document model defines a custom field namedproduct_numberyou can use it directly within the loop.{{ item.product_number }}Display its value.AutoCMS will provide these custom fields as part of the document object.|safeUsed for HTML content (or auxiliary tags) to render correctly.