How to filter and display specific models or categories of content on the document list page?

When managing website content, we often need to display specific types or themes of content on different list pages, such as article lists, product display pages, or detailed summaries of custom models.This is not only about whether users can efficiently find the information they need, but also directly affects the overall layout and user experience of the website.English CMS provides us with powerful tools with its flexible content model and efficient system architecture, allowing us to accurately filter and personalize the display of content.

The core of content organization: models and categories

In the AnQi CMS, the organization of website content cannot be separated from "Content Model" and "Document ClassificationThe 'Content Model' defines the structure and properties of content, such as the 'Article' model can have title, body, publish time, etc. fields, while the 'Product' model may include product name, price, stock, etc. fields.By customizing the content model, we can create various types of content according to business requirements.

“Document classification” is like a library shelf, used for classifying content.Each document will be assigned to a specific category, and this category itself belongs to a content model.Such a hierarchical structure makes content management orderly.

To flexibly display these contents on the front-end page, the core tool is template tags. Specifically,archiveListTags are our powerful assistants for displaying contents on the list page.

How to filter content by category

The most common content filtering requirement is to display content according to a specific "document category".For example, you may wish to display all articles under 'News Center' on a single page.

At this point, we just need toarchiveListlabel, throughcategoryIdspecify the category ID with the parameter. This ID is usually found in the "Document Category" management on the back end.

{% archiveList articles with categoryId="1" limit="10" %}
    {% for item in articles %}
        <li><a href="{{item.Link}}">{{item.Title}}</a></li>
    {% empty %}
        <li>目前该分类下没有内容。</li>
    {% endfor %}
{% endarchiveList %}

Sometimes, there may be subcategories under a category. By default,archiveListThe label will also display all documents under the specified parent category ID. If you only want to display documents under the current category and not include the content of its subcategories, you can add an extra setting.child=falseParameters:

{% archiveList articles with categoryId="1" child=false limit="10" %}
    {# 仅显示分类ID为1的文档，不包含子分类 #}
{% endarchiveList %}

Based on content model to filter and display

The "Flexible Content Model" feature of AnQi CMS is one of its highlights, allowing us to define different structures of content, such as "articles", "products", or custom models. If you want to display only the content under a specific model on the list page, for example, only show all "products" rather than "articles", thenmoduleIdThe parameter comes into play.

You can find the corresponding model ID in the "Content Model

{% archiveList products with moduleId="2" limit="10" %}
    {% for item in products %}
        <li><a href="{{item.Link}}">产品名称：{{item.Title}}</a></li>
    {% empty %}
        <li>目前没有产品信息。</li>
    {% endfor %}
{% endarchiveList %}

So, your list page will only display content under the product model and will not mix in articles.

Combine with custom parameters for advanced filtering.

For more complex, multi-dimensional content filtering needs, such as a real estate website that needs to filter based on 'Property Type' (residential, commercial) and 'Area Size' (small户型, large户型), Anqi CMS provides the 'Document Parameter Filtering Tag' ——archiveFilters.

Firstly, you need to make sure that these filterable "custom fields" are added to the "Content Model" in the background.For example, add the fields "House Type" and "Area Size" to the property model and set the corresponding options.

Next, in the template,archiveFilterstags are responsible for generating the user interface for筛选条件的筛选条件，whilearchiveListtags will automatically display the corresponding content based on the user's selected filtering conditions.

UsearchiveFiltersthe same time, it also needs to be done throughmoduleIdThe specified parameter is which content model filter condition.This tag will generate a data structure containing all the filter conditions, you can iterate over it in the template to create click-through links for users.

When the user clicks on these filter links, the filter parameters are passed as query parameters (Query Parameter) in the URL. Amazingly,archiveListLabels will automatically identify and apply these URL filter parameters, without additional configuration, and can automatically display content that meets the filter criteria.

A typical usage might look like this:

`twig

<h3>筛选房产：</h3>
{% archiveFilters filterOptions with moduleId="1" allText="不限" %}
    {% for filterGroup in filterOptions %}
        <p>{{ filterGroup.Name }}:</p>
        <div>
            {% for option in filterGroup.Items %}
                <a class="{% if option.IsCurrent %}active{% endif %}" href="{{ option.Link }}">{{ option.Label }}</a>
            {% endfor %}
        </div>
    {% endfor %}