How to call and display a document list in a template, and perform sorting and filtering?

Manage and display website content in Anqi CMS, especially document lists, is a very common need in daily operations.AnQi CMS provides powerful and flexible template tags, allowing us to easily call and display these contents on the website front-end, and sort and filter them as needed.This article will delve into how to use the template function of Anqi CMS to achieve these goals, making your website content more attractive.

Core function:archiveListTag - Display the basic content of the document

To display the document list, we mainly use the Anqi CMS'sarchiveListtag. This tag is the core of calling document data, which can retrieve the documents you want to display according to various conditions.

Usually, you would use it like this in a template file (such as a list page or home page):

{% archiveList archives with type="list" limit="10" %}
    {% for item in archives %}
    <li>
        <a href="{{ item.Link }}">
            <h3>{{ item.Title }}</h3>
            <p>{{ item.Description|truncatechars:100 }}</p>
            <div>
                <span>发布日期: {{ stampToDate(item.CreatedTime, "2006-01-02") }}</span>
                <span>浏览量: {{ item.Views }}</span>
            </div>
        </a>
        {% if item.Thumb %}
            <img src="{{ item.Thumb }}" alt="{{ item.Title }}">
        {% endif %}
    </li>
    {% empty %}
    <li>暂时没有文档内容。</li>
    {% endfor %}
{% endarchiveList %}

In this code block,archiveListThe tag assigns the set of retrieved documents toarchivesthis variable. Then, we use{% for item in archives %}Loop through each document and displayitem.Title/item.Link/item.Descriptionfields to show the document title, link, and summary.stampToDateIt is a very practical function that is used to format timestamps into readable dates. If there is no documentation,{% empty %}the block will display the preset prompt information.

archiveListThe tag supports a series of parameters that allow you to precisely control which documents to display and how they are displayed:

  • moduleId: Specify the ID of the content model (for example, articles are usually 1, products might be 2), make sure you are calling the correct type of content.
  • categoryId: Filter documents based on category ID, you can specify a single ID, or use commas to separate multiple IDs, or even usechild=trueorchild=falseto determine whether to include documents from subcategories.
  • limit: Controls the number of documents displayed. For examplelimit="10"Displays the most recent 10 documents. It also supportsoffsetpattern, such aslimit="2,10"It means to get 10 data items starting from the 2nd one.
  • type: This is a very critical parameter, defining the type of the list.
    • type="list"Used for simple list display, affected bylimitParameter limit.
    • type="page"Used for lists that require pagination, must be used with.paginationlabel usage
    • type="related"Used to display related documents, usually on the document detail page.
  • order: Used to specify the document sorting rules.

Masterfully control: Sorting of document lists

Anqi CMS makes sorting documents effortless, byarchiveListlabel'sorderParameters, you can sort documents according to multiple dimensions.

  • Sort by latest release: Use.order="id desc"Will place the latest documents at the top.
  • Sorted by views:order="views desc"Can prioritize documents with the highest number of views for recommended popular content.
  • Sorted by custom order in the background.If you have manually sorted the documents in the background,order="sort desc"Will be displayed in the order you customize.

For example, to display the top five articles with the highest views under a certain category, you can write it like this:

{% archiveList hotArticles with categoryId="1" order="views desc" limit="5" %}
    <h4>热门文章</h4>
    <ul>
    {% for item in hotArticles %}
        <li><a href="{{ item.Link }}">{{ item.Title }} ({{ item.Views }}次浏览)</a></li>
    {% endfor %}
    </ul>
{% endarchiveList %}

Accurate positioning: filtering the document list

Filtering is an indispensable part of content operation, AnQi CMS provides various filtering methods to help you present the most suitable content to users.

  1. Filter by categoryThis is the most basic filtering method. BycategoryId="1"You can display all documents under the category with ID 1. If you want to include subcategories, you can add extra ones.child=true.

  2. Filter by recommended attributes: Anqi CMS allows you to set various recommended properties for documents, such as 'Headline', 'Recommended', 'Slideshow', and others. Useflagparameters to call documents with these specific properties, such asflag="h"Call the headline article,flag="c"Call the recommended article.

  3. Keyword search filtering: When you need to add a search function to the list page,qThe parameter is very useful. It will automatically read the URL in.qQuery parameters act as search keywords to match document titles. You can search on the page.archiveListOmitted in the tagqParameters, the system will automatically capture the search terms in the URL.

  4. Custom parameter filtering:archiveFiltersTagWhen your document model includes custom fields (such as "color", "size", "layout", etc.) and you want users to be able to filter through these custom fields,archiveFiltersTags are particularly powerful.

    It generates a list of selectable filter conditions, each with corresponding links that can trigger the filter when clicked.

    <div>
    <h5>筛选条件</h5>
    {% archiveFilters filters with moduleId="1" allText="不限" %}
        {% for item in filters %}
        <p>{{ item.Name }}:</p>
        <ul>
            {% for val in item.Items %}
            <li class="{% if val.IsCurrent %}active{% endif %}">
                <a href="{{ val.Link }}">{{ val.Label }}</a>
            </li>
            {% endfor %}
        </ul>
        {% endfor %}
    {% endarchiveFilters %}
</div>

    here,filtersThe variable includes all the available custom parameters and their options.item.NameIs the parameter name (such as “Type of house”),item.ItemsIt is all the optional values under this parameter (such as "One-bedroom", "Two-bedroom"),val.LinkIt provides a URL for filtering after clicking.val.IsCurrentIt determines whether the current option is selected.

A smooth experience: Implement the pagination function of the document list

Pagination is an essential function for websites with a large amount of content. The pagination implementation of Anqi CMS is very simple, you just need to cooperatearchiveListoftype="page"Parameters andpaginationTag it and it is.

  1. settingarchiveListFor pagination modeEnsure that inarchiveListSet in the labeltype="page"so that it can respond to pagination requests and return the data of the current page.
  2. **Usepagination