How to filter and display content under specific models or categories 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 concerns whether users can efficiently find the information they need and also directly affects the overall layout and user experience of the website.Anqi CMS provides us with powerful tools with its flexible content model and efficient system architecture, allowing us to accurately filter and personalize content display.

The core of content organization: models and categories

In Anqi CMS, the organization of website content cannot do without the 'content model' and 'document classification'.The content model defines the structure and properties of content, such as the 'article' model can have a title, body, and publication time fields, while the 'product' model may include product name, price, and inventory fields.By customizing the content model, we can create various types of content based on business needs.

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

To flexibly display this content on the front-end page, the core tool is the template tag. Specifically,archiveListTags are our powerful assistants for displaying content on list pages.

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 the "News Center" on a particular page.

At this point, we just need toarchiveListtags, throughcategoryIdSpecify the category ID in the parameters. This ID is usually found in the background "Document Category" management.

{% 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 without including the content of its subcategories, you can add an extra one.child=falseparameters:

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

Based on content model filtering display

The flexible content model feature of Anqi CMS is one of its major highlights, allowing us to define different content structures, such as 'articles', 'products', or custom models. If you want to display only specific model content on the list page, for example, only all 'products' and not 'articles', thenmoduleIdThe parameters come into play.

You can find the corresponding model ID in the "Content Model" management in the background. For example, suppose the ID of the "Article" model is 1, and the ID of the "Product" model is 2.

{% 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 %}

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

Combine 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 apartment, large apartment), Anqi CMS provides 'document parameter filtering tags'——archiveFilters.

First, you need to make sure that these filterable "custom fields" are added to the model in the "content model" backend.For example, add 'house type' and 'area size' fields to the real estate model and set the corresponding options.

Next, in the template,archiveFiltersthe tag is responsible for generating the user interface for the filter conditions, whilearchiveListthe tag will automatically display the corresponding content based on the filter conditions selected by the user.

UsearchiveFiltersat the same time, it also needs to go throughmoduleIdThe parameter specifies which content model's filtering conditions. This tag generates a data structure containing all the filtering conditions, which you can traverse in the template to create click-through filtering links for users.

When the user clicks on these filter links, the link will pass the filter parameters as query parameters in the URL. Amazingly,archiveListLabels will automatically identify and apply these URL filtering parameters, without any additional configuration, and automatically display content that meets the filtering 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 %}