How to display a document list on the AnQiCMS website based on a specific category ID?

In AnQiCMS, displaying a document list based on a specific category ID is a very basic and commonly used feature that allows us to flexibly organize and present website content.AnQiCMS's powerful template tag system makes this operation intuitive and efficient.Whether you want to manually insert a category of documents at a specific location on the page or want the entire category page to automatically display the documents below it, the system provides the corresponding solutions.

Flexible applicationarchiveListTag display document

One of the core advantages of AnQiCMS is its rich template tags. To display the document list according to the category ID, we mainly usearchiveListThis tag. This tag allows you to highly customize the type of documents to display, the number, sorting method, and most importantly - from which category.

Basic usage: specify the category ID

In your AnQiCMS template file, such as on the homepage or in a sidebar, you can usearchiveListLabel to specify the category ID to be displayed. For example, if you have an ID of10The "News Dynamic" category, and if you want to list the documents under this category on the page, you can write the template code like this:

{% archiveList newsArchives with categoryId="10" limit="5" %}
    {% for item in newsArchives %}
    <li>
        <a href="{{ item.Link }}">{{ item.Title }}</a>
        <span>发布日期: {{ stampToDate(item.CreatedTime, "2006-01-02") }}</span>
    </li>
    {% empty %}
    <li>暂无新闻动态。</li>
    {% endfor %}
{% endarchiveList %}

In this code block,categoryId="10"Explicitly tell AnQiCMS to only retrieve documents under the category with ID 10.limit="5"Then it limited to only show the latest 5 articles.newsArchivesThis is the variable name specified for the document list obtained, you can traverse this variable in subsequentforloop, and useitem.LinkGet the document link,item.TitleGet the document title,item.CreatedTimeto obtain the publish time (and usestampToDatethe filter for formatting).{% empty %}The label is used to display alternative content when the list is empty.

Extended usage: specifies the document model and more information

In addition to the category ID, you can further refine the filtering criteria. For example, if you want to display documents under the specific category "Product Model", you need to addmoduleIdParameters. You can also easily display more document information, such as thumbnails, descriptions, and views:

{% archiveList productItems with categoryId="15" moduleId="2" limit="8" order="views desc" %}
    {% for item in productItems %}
    <div class="product-card">
        <a href="{{ item.Link }}">
            {% if item.Thumb %}<img src="{{ item.Thumb }}" alt="{{ item.Title }}" />{% endif %}
            <h3>{{ item.Title }}</h3>
            <p>{{ item.Description|truncatechars:100 }}</p> {# 截取简介前100字 #}
            <span>浏览量: {{ item.Views }}</span>
        </a>
    </div>
    {% endfor %}
{% endarchiveList %}

here,categoryId="15"specifying the category,moduleId="2"Represents the document for obtaining the product model,order="views desc"Then the product will be sorted from high to low by views.item.ThumbUsed to display thumbnails,item.DescriptionDisplay document summary, and usetruncatecharsFilter for truncation.

Handle pagination list

When the number of documents under a category is large, pagination display is essential. To implement pagination, you need toarchiveListlabel'stypethe parameter to"page"and combiningpaginationTags:

{% archiveList documents with categoryId="20" type="page" limit="10" %}
    {% for item in documents %}
    {# 展示文档详情，如标题、链接、简介等 #}
    <article>
        <h3><a href="{{ item.Link }}">{{ item.Title }}</a></h3>
        <p>{{ item.Description }}</p>
    </article>
    {% endfor %}
{% endarchiveList %}

{# 分页控制区域 #}
<div class="pagination-controls">
    {% pagination pages with show="5" %} {# 最多显示5个页码按钮 #}
        {% if pages.PrevPage %}<a href="{{ pages.PrevPage.Link }}">上一页</a>{% endif %}
        {% for pageItem in pages.Pages %}
            <a class="{% if pageItem.IsCurrent %}active{% endif %}" href="{{ pageItem.Link }}">{{ pageItem.Name }}</a>
        {% endfor %}
        {% if pages.NextPage %}<a href="{{ pages.NextPage.Link }}">下一页</a>{% endif %}
    {% endpagination %}
</div>

Bytype="page",archiveListIt will return the documents on the current page and pagination information.paginationThe tag is responsible for rendering the "Previous page", "Next page", and specific page number buttons.pages.PagesIt is an array that contains all available page number information and can be displayed in a loop.

Utilize the category template mechanism to achieve automatic display

AnQiCMS also provides a more automated way to handle the display of category document lists, which is particularly convenient for maintaining websites with a large number of categories:Category template mechanism.

When you visit a category page, AnQiCMS will automatically search and apply the corresponding template file according to certain rules.One of the rules is to match based on the category ID and content model.

Automatic template matching:You can create a template file of the form in the template directory.{模型table}/list-{分类ID}.htmlThe template file. For example, if your article model table name isarticle, and the category ID is10Then you can create a file namedarticle/list-10.htmlThe template file. When accessing ID of10When on the article classification page, AnQiCMS will automatically load and use this template file.

Backend specified template: You can also edit each category in the AnQiCMS backend, manually specify a template file in the 'Category Template' option. For example, you can specify the use ofcustom/my-category-list.htmlThis serves as its document list template. This way, you can design completely independent layouts and styles for different categories without repeating the code in each templatearchiveListlabel'scategoryIdParameters. In these custom category templates,archiveListtags are usually not specifiedcategoryIdbecause it will automatically recognize the current category ID.

Example:article/list-10.htmlTemplate content

assuming you have already createdarticle/list-10.htmlThis template file, its content can be written like this:

<h1>{{ categoryDetail with name="Title" }}</h1> {# 显示当前分类标题 #}
<p>{{ categoryDetail with name="Description" }}</p> {# 显示当前分类描述 #}

<div class="document-list">
    {% archiveList categoryDocuments with type="page" limit="10" %} {# 自动获取当前分类ID下的文档 #}
        {% for item in categoryDocuments %}
        <article>
            <h2><a href="{{ item.Link }}">{{ item.Title }}</a></h2>
            <time datetime="{{ stampToDate(item.CreatedTime, "2006-01-02T15:04:05Z07:00") }}">{{ stampToDate(item.CreatedTime, "2006年01月02日") }}</time>
            <p>{{ item.Description|truncatechars:150 }}</p>
        </article>
        {% endfor %}
    {% endarchiveList %}

    <div class="pagination-area">
        {% pagination pages with show="5" %}
            {# 分页代码同上 #}
        {% endpagination %}
    </div>
</div>

in thislist-10.htmlin the template,archiveListThe label is not explicitly writtencategoryId="10"It intelligently identifies the category ID of the current page, thereby automatically displaying the documents under that category. This approach greatly enhances the maintainability and reusability of the template.

In summary, whether by specifying precisely in any templatecategoryIdIt is still simple and efficient to display the document list under a specific category ID by using AnQiCMS's intelligent classification template mechanism.Understand and master these methods, which will help you better manage and present your website content.

Frequently Asked Questions (FAQ)

1. Why is the pagination not displayed in my document list?If the pagination is not displayed in your document list, please checkarchiveListDid the tag set the parametertype="page"Only after setting the parametertypeis set to"page",archiveListThe tag will generate the data required for pagination. At the same time, you also need toarchiveListTag