Build an energetic website in AnQiCMS, the display of the content list is an indispensable part.Whether it is displaying the latest released articles, hot products, or content under specific categories, AnQiCMS's powerful template engine can help us easily achieve it.This article will delve into how to obtain and loop through lists of articles or products in AnQiCMS, helping you flexibly build diverse content display pages.

Understanding the content list mechanism of AnQiCMS

AnQiCMS adopted a template engine syntax similar to Django, making content display intuitive and easy to master.In AnQiCMS, articles and products are both considered as a type of content, and they share a flexible content model system.This means we can retrieve and display lists of different types of content in a unified way.

The core template tags are the entry points for operating content, which usually appear in the form of{% tag %}, and the variables to be output are enclosed in{{ variable }}. For displaying content in a loop,forLoop tags are our powerful assistants.

Get the list of articles or products: Core tagsarchiveList

To get the list of articles or products,archiveListLabels are your preferred choice. This label is very flexible and can filter, sort, and limit content according to your needs.

UsearchiveListWhen labeling, it is usually specified a variable name to store the list of obtained contents, for examplearchivesorproducts. The basic structure is as follows:

{% archiveList archives with moduleId="1" limit="5" %}
    {% for item in archives %}
        {# 在这里展示每个内容项的详细信息 #}
    {% endfor %}
{% endarchiveList %}

Next, we will understand in detailarchiveListThe common parameters of some, they are the key to custom content lists:

  1. moduleIdSpecify the content modelAnQiCMS supports custom content models, common ones include article models (usually)moduleId="1") and product models (usually)moduleId="2"）。Through this parameter, you can explicitly specify the type of content you want to retrieve.

    • For example, to get a list of articles:moduleId="1"
    • For example, to get a list of products:moduleId="2"

  2. categoryId：Filter specific categoriesIf you only want to display content under a certain or certain categories, you can usecategoryId. You can pass the ID of a single category, or separate multiple IDs with commas.

    • For example, get articles with category ID 10:categoryId="10"
    • For example, get products with category IDs 10, 12, 15:categoryId="10,12,15"
    • If you want it not to automatically read the current page category ID, but to get the entire site content, it can be set tocategoryId="0".

  3. limit: Control the number of displayed items or pagination range limitParameters are used to limit the number of displayed content. It has two working modes:

    • Limit the number:limit="5"Only the first 5 contents will be displayed.
    • Offset mode:limit="2,10"The next 10 contents (often used in the scenario of 'start displaying from...') will be retrieved starting from the second item.

  4. order: Specify the sorting methodThe display order of the content is very important.orderThe parameter allows you to sort by various conditions:

    • id desc: Sort by content ID in descending order (the most recently published content first).
    • views desc: Sort by view count in descending order (popular content first).
    • sort desc：The list is sorted in reverse order according to the custom sorting field set in the background.

  5. type：The list type determines the function typeThe parameter defines the purpose of the list, which will affect the effective way of other parameters:

    • type="list"：Default mode, only display.limitSpecify the number of contents without pagination.
    • type="page"：Pagination mode, combined with.paginationtags to implement full pagination functionality.
    • type="related"：related content mode, usually used on detail pages, automatically searches for other content related to the current content.

  6. flag：filter recommended propertiesWhen publishing content in the background, you can set various recommendation attributes for the content (such as headlines [h], recommendations [c], sliders [f], etc.). ThroughflagParameter, you can only display content with specific attributes.

    • For example, only display articles with the 'recommended' attribute:flag="c"
    • You can also useexcludeFlagto exclude content with specific attributes.

  7. q: Search keywordsWhentype="page"whenqThe parameter can be used to search for content titles that contain specific keywords. If you include the parameter in the URL,?q=关键词AnQiCMS will also automatically read and apply the search.

Loop traversal and data access

Once usedarchiveListAfter getting the content list, you can{% for item in archives %}access each item in the list one by one in such a structure. Inside the loop,itemThe current content object, you can access various properties of it, such as:

  • {{ item.Id }}: Content ID
  • {{ item.Title }}: Content Title
  • {{ item.Link }}: Content Link
  • {{ item.Description }}: Content Summary/Description
  • {{ item.Thumb }}：Content Thumbnail
  • {{ item.Logo }}：Content Cover Large Image
  • {{ item.Views }}：Content Views
  • {{ stampToDate(item.CreatedTime, "2006-01-02") }}：Formatted Publish Time (stampToDateIt is a date formatted tag,"2006-01-02"Is the Go language time formatting standard)

Example: Display the latest article title and link

<div class="latest-articles">
    <h3>最新文章</h3>
    <ul>
        {% archiveList articles with moduleId="1" order="id desc" limit="5" %}
            {% for item in articles %}
                <li><a href="{{ item.Link }}">{{ item.Title }}</a></li>
            {% empty %}
                <li>暂无文章</li>
            {% endfor %}
        {% endarchiveList %}
    </ul>
</div>

Implement pagination function:paginationtags

For lists with a large amount of content, pagination is a key factor in improving user experience. WhenarchiveListTagstypeparameter settings"page"it coordinates withpaginationLabel works together, implementing a complete pagination navigation.

paginationHow to use labels:

{% pagination pages with show="5" %}
    {# 在这里组织分页链接，例如上一页、下一页、页码等 #}
{% endpagination %}

paginationThe tag will create apagesAn object that contains rich pagination information:

  • pages.TotalItems: Total number of contents
  • pages.TotalPagesTotal number of pages:
  • `pages.Current