As an experienced website operations expert, I know that the core value of a Content Management System (CMS) lies in its flexibility and fine control over content display.The AnQiCMS (AnQiCMS) performs particularly well in this aspect, thanks to its efficient architecture based on the Go language and its rich feature set.For daily content operations, how to efficiently organize and display the document list under the tag (Tag), while providing friendly pagination and sorting features, is a key factor in improving user experience and website SEO performance.
Today, let's delve into how to skillfully combine built-in template tags in AnQiCMS to achieve pagination display and flexible sorting of tag document lists.
English in AnQiCMS tag and content organization
In AnQiCMS, tags are an indispensable part of content organization.It allows us to associate documents with common topics or keywords, even if these documents belong to different categories or models.Through the "Content Management" module under the "Document Tag" feature, we can easily create, edit, and manage all tags of the website.Each tag can have its own name, description, and custom URL, which provides great convenience for SEO optimization.
When a user accesses a specific tab, they usually expect to see all relevant documents under that tab. This list of documents is generally generated through a dedicated template file (usually}]}tag/list.html)to render, and use the powerful template tags built into AnQiCMS to dynamically retrieve data.
Implement pagination display of tag document lists.
To enable pagination for the label document list, the core lies intagDataListTagstypethe parameters and the subsequent usagepaginationLabel.
Firstly, we need to utilizetagDataListLabel to retrieve document data under a specified label. In the default label document list template filetag/list.htmlin,tagDataListLabels will automatically recognize the current page's label ID. To enable pagination, we need to settypeparameter settings"page"and is usedlimitThe parameter defines the number of documents to display per page, for example set tolimit="10"Represents 10 documents displayed per page.
OncetagDataListSet to pagination mode, we can introduce the powerful AnQiCMS.paginationTags to render the page numbers.paginationThe label will automatically calculate the total number of pages, current page number, generate the first page, last page, previous page, next page, and links to the middle page numbers, and can be controlled by parameters.showThe number of middle page numbers, for example,show="5"It will display the page numbers of the two pages before and after the current page, up to a maximum of five pages.
The following is an example of a template code for implementing pagination display:
{# tag/list.html 模板文件示例 #}
<div>
<h1>标签:{% tagDetail with name="Title" %}</h1>
<p>描述:{% tagDetail with name="Description" %}</p>
{% tagDataList archives with type="page" limit="10" %}
{# 循环展示当前页的文档列表 #}
{% for item in archives %}
<li>
<a href="{{item.Link}}">
<h5>{{item.Title}}</h5>
<p>{{item.Description}}</p>
<div>
<span>分类:{% categoryDetail with name="Title" id=item.CategoryId %}</span>
<span>发布时间:{{stampToDate(item.CreatedTime, "2006-01-02")}}</span>
<span>浏览量:{{item.Views}} 阅读</span>
</div>
</a>
{% if item.Thumb %}
<a href="{{item.Link}}">
<img alt="{{item.Title}}" src="{{item.Thumb}}">
</a>
{% endif %}
</li>
{% empty %}
<li>
该标签下暂无任何文档。
</li>
{% endfor %}
{% endtagDataList %}
{# 分页代码区域 #}
<div class="pagination-container">
{% pagination pages with show="5" %}
<ul>
{# 首页链接,如果当前是首页则添加active类 #}
<li class="{% if pages.FirstPage.IsCurrent %}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 item in pages.Pages %}
<li class="{% if item.IsCurrent %}active{% endif %}">
<a href="{{item.Link}}">{{item.Name}}</a>
</li>
{% endfor %}
{# 下一页链接,如果存在则显示 #}
{% if pages.NextPage %}
<li><a href="{{pages.NextPage.Link}}">{{pages.NextPage.Name}}</a></li>
{% endif %}
{# 尾页链接 #}
<li class="{% if pages.LastPage.IsCurrent %}active{% endif %}">
<a href="{{pages.LastPage.Link}}">{{pages.LastPage.Name}}</a>
</li>
{# 还可以显示总数、当前页等信息,例如: #}
<li class="info">共 {{pages.TotalItems}} 条,{{pages.CurrentPage}}/{{pages.TotalPages}} 页</li>
</ul>
{% endpagination %}
</div>
</div>
In this example, we first usetagDetailThe tag retrieves the title and description of the current tag and thentagDataListGet the document list and enable pagination.forto iteratearchivesVariables are used to display each document.paginationTags are responsible for generating and rendering a beautiful and functional pagination navigation.
Optimize the sorting of the tag document list
In addition to pagination, users often also hope that the content can be sorted according to different criteria, so as to find the information they are interested in more quickly.tagDataListTags provide flexibleorderParameters allow us to sort in ascending or descending order based on various fields.
Common sorting methods include:
- Descending by ID (
order="id desc")This usually means items are arranged in the latest publish order, with the most recently published documents displayed at the top. - Sorted by views in descending order (
order="views desc")This will be sorted according to the document reading volume, with the most popular and most read documents displayed first. - Sorted by backend customization (
order="sort desc")If the manual sorting field is set for documents in the background content management, this option can display content according to the order preset by the operator, which is very suitable for high-quality recommendation or special topic display.
We can imagine thatorderParameters are directly added totagDataListLabels, for example, if you want the document list in the label to be sorted by the latest published time, you can set it like this:
{% tagDataList archives with type="page" limit="10" order="id desc" %}
{# 文档列表内容 #}
{% endtagDataList %}
If you want to display the most popular documents, you can change it to:
{% tagDataList archives with type="page" limit="10" order="views desc" %}
{# 文档列表内容 #}
{% endtagDataList %}
Practical skills and the advantages of AnQiCMS
Combining pagination and sorting features, we can provide users with a highly controllable and smooth experience for browsing tag document pages. For example, intag/list.htmlby default, the latest published (id descThe content is displayed by page. If you need to provide users with options to switch sorting methods, you can add some links or buttons on the page, by modifying the query parameters of the URL (for example?order=views_desc)to dynamically adjusttagDataListoforderParameter.
AnQiCMS has demonstrated its powerful advantages as an enterprise-level CMS during this process:
- Highly customizableThe flexibility of template tags allows developers and operators to fully customize the content display logic according to business requirements, whether it is sorting, pagination style, or the presentation of document content, which can be easily achieved.
- SEO-friendlyThrough the pseudo-static rules, generate friendly URLs for tabs, combined with pagination and sorting features, which helps search engines better crawl and index the content under the tabs, enhancing the overall SEO performance of the website.
- Enhance user experience:Clear label classification, efficient document list browsing (via pagination) and personalized sorting options greatly enhance the efficiency and satisfaction of users in finding information on the website.
- Lightweight and EfficientBased on Go language development, AnQiCMS can maintain excellent performance and response speed even when handling a large amount of tag and document data, ensuring a smooth user experience.
Through these features, Safe CMS not only simplifies content management, but also empowers operators to achieve better results in content marketing and user growth.
Common Questions (FAQ)
Q1: How to display the current tag name and description on the tag page?
A1:In the tag document list page (for example)tag/list.htmlyou can directly usetagDetailLabel to get the detailed information of the current label. For example, to display the label title, you can use{% tagDetail with name="Title" %}; To display the label description, then use{% tagDetail with name="Description" %}These tags will automatically identify the current page's tag ID and output the corresponding content.
Q2: Why is my tag document list not paginated correctly, or why are the pagination links not working?
A2:Please checktagDataListWhether the label willtypeParameters are set correctly"page"[for example]{% tagDataList archives with type="page" limit="10" %})。Only when set to"page"mode,paginationLabels must be used to retrieve the correct pagination data and generate usable pagination links. At the same time, ensure that your template also includes the complete{% pagination pages with show="X" %}...{% endpagination %}code block to render page numbers.
Q3: Can I customize the URL structure of the tag document list, for example, including the tag name instead of the ID?
A3:It can be. AnQiCMS supports flexible pseudo-static (URL rewriting) rule configuration. You can configure it in the background.