In the vast realm of AnQi CMS, content operation experts often face a challenge: how to make it convenient and quick for users to find the information they need?Especially when the website content structure is complex, such as e-commerce products, real estate information, or various categorized articles, a flexible and efficient filtering mechanism becomes particularly important.archiveFiltersLabel collaborative work, creating personalized content filtering functions for your website.

Flexible filtering: a 'tool' for content operation.

AnQi CMS is renowned for its high flexibility and customizability, with 'Flexible Content Model' being one of its core strengths.This means that you can define the structure of different types of content according to your business needs, rather than being limited to traditional 'articles' or 'products'.This flexibility provides a solid foundation for implementing complex filtering.

Imagine you are running a real estate website, where users may want to filter property information based on multiple dimensions such as 'Property Type' (apartment, villa, shop), 'Area' (Beijing, Shanghai, Guangzhou), and 'Price Range'.It is almost unimaginable without a mature screening mechanism.archiveFiltersLabels are born to solve this pain point, they can dynamically generate these filtering conditions and seamlessly integrate with the content list.

Core Foundation: Custom fields of the document model

archiveFiltersThe flexibility of the label's filtering capability lies in its ability to read and utilize the 'document model custom fields' you define in the background.These custom fields are the core foundation for personalized content filtering.

Let's take a step-by-step look at how to configure these key parameters in the Anqi CMS backend:

  1. Enter the content model management:Log in to the AnQi CMS backend, navigate to the "Content Management" menu, and select "Content Model".Here is listed all the defined content models on the website, such as 'Article Model', 'Product Model', etc., and you can also create new custom models.
  2. Select or create a model and edit fields:Click the model you want to edit with the filter function, or create a new model.In the model editing interface, you will see an area named "Content Model Custom Fields".This is where we perform the "magic".
  3. Define custom fields:Click the "Add Field" button to add a new custom field to your filter criteria. Key configuration items include:
    • Parameter name:This is the Chinese name displayed on the backend, such as 'House Type', 'Location Area'.
    • Field call:This is the lowercase English field name used to call the template tag, as well as the field name stored in the database. Make sure to use English letters, for examplehouse_type/region. It is recommended to be concise and meaningful.
    • Field Type:This is a crucial step that determines how the fieldarchiveFiltersis labeled and processed.
      • for filter conditions that need to generate a list of options(such as house type, area), you should select the appropriate oneSingle selectionMultiple selectionorDrop-down selection.
      • For these selection fieldsYou need to enter in the “Default value” area,Enter a predefined option value per line.For example, if there are three options of 'House Type' such as 'Apartment', 'Villa', and 'Shop', enter them in three lines in the default value.The AnQi CMS will generate the frontend filter options based on these default values.
      • The fields of type 'Single-line text', 'Number', and 'Multi-line text' are typically used for entering content or as the basis for precise search (via URL parametersqThey will not bearchiveFiltersLabels are directly used to generate option lists.
    • Mandatory:Select whether to force content publishers to fill in this field according to your business requirements.
    • Default value:In addition to defining options for selective fields, other fields can also be set to default values, so that they are automatically filled in when publishing content.

By following these steps, you have configured custom fields that can be used to filter specific content models.When you publish documents under this model, these custom fields will appear in the 'Other Parameters' collapsible box, allowing you to finely tag each document.

Magic of the front-end template:archiveFiltersApplication of tags

After the background configuration is completed, the next step is to display these filter conditions to the user.archiveFiltersLabels play a crucial role in the frontend template.

archiveFiltersTags are typically used on document list pages or category pages, and they combine the context of the current page (such as the current document model ID) to generate the corresponding filters. Their basic usage is as follows:

{# 假设我们正在一个文档列表页，需要为模型ID为1的文档生成筛选器 #}
<div>
    <h3>筛选条件：</h3>
    {% archiveFilters filters with moduleId="1" allText="全部" %}
        {% for item in filters %}
        <div class="filter-group">
            <span class="filter-name">{{ item.Name }}:</span>
            <ul class="filter-options">
                {% for val in item.Items %}
                <li class="filter-option {% if val.IsCurrent %}active{% endif %}">
                    <a href="{{ val.Link }}">{{ val.Label }}</a>
                </li>
                {% endfor %}
            </ul>
        </div>
        {% endfor %}
    {% endarchiveFilters %}
</div>

{# 筛选结果通常会与 archiveList 标签结合使用，以显示过滤后的文档列表和分页 #}
<div>
    <h3>筛选结果：</h3>
    {% archiveList archives with moduleId="1" type="page" limit="10" %}
        {% for item in archives %}
        <div class="archive-item">
            <h4><a href="{{ item.Link }}">{{ item.Title }}</a></h4>
            <p>{{ item.Description }}</p>
            {# 这里可以展示其他文档信息，例如自定义字段的值 #}
        </div>
        {% empty %}
        <p>没有找到符合条件的文档。</p>
        {% endfor %}
    {% endarchiveList %}

    {# 分页导航 #}
    {% pagination pages with show="5" %}
        {# 渲染分页链接 #}
    {% endpagination %}
</div>

In this template code:

  • moduleId="1"Specify which document model (such as article model, the ID is usually 1) to generate the filter for. Make sure the ID here matches the model ID of the custom field you configured in the backend.
  • allText="全部"：Generate a 'All' option for each filtering dimension, convenient for users to cancel a specific filtering condition.
  • filters：This isarchiveFiltersAn array output by the tag, which includes all the selectable dimensions (such as 'House Type', 'Location').
  • item.NameShow the name of the filtered dimension (i.e., the 'parameter name' you set in the backend).
  • item.ItemsAre all the available options under the current filter dimension (i.e., each option you enter per line in the 'Default Value' section on the backend).
  • val.LinkThis is the URL that will be redirected to after clicking the option, Anqi CMS will automatically handle the URL parameters to filter the content.
  • val.IsCurrentA boolean value indicating whether the current option is selected, convenient for you to add in the frontend.activeStyling to highlight.

Through this method, when the user clicks on a filter option, the page will refresh and display the filtered content list.

Practical suggestions and precautions

  1. Plan first:Before getting started with the configuration, make sure you have a clear understanding of the filtering dimensions your website requires and the available options for each dimension. This will help you design the document model more efficiently.
  2. Appropriate field type:Ensure that you select the field type as 'Single Selection', 'Multiple Selection', or 'Dropdown Selection' for the filter, and correctly configure the 'Default Value' as a filter option.
  3. moduleIdIt is crucial:EnsurearchiveFiltersthe tag inmoduleIdThe parameters must strictly match the document model ID you want to filter.
  4. Combine pagination and search: archiveFiltersTags are usually witharchiveList[Used for content list] andpaginationtags should be used together to provide a complete filtering, display, and navigation experience. In addition, if you also want to implement keyword search,archiveListLabels are supportedqParameter.
  5. Front-end styles:Although the core functionality is provided by Anqi CMS, the aesthetics and user experience of the filter largely depend on the frontend CSS and JavaScript code.

Through detailed backend configuration and flexible template application, the Anqi CMS'sarchiveFiltersTags allow your website to have powerful content filtering capabilities, greatly enhancing the efficiency of users finding information and the overall user experience of the website.

Common Questions (FAQ)

1. What are the naming conventions and注意事项 for the 'invoked field' of custom fields?The 'Field Name' is the unique identifier you use to reference this custom field data in the template, which is also the field name in the database.The 'Call Field' required by AnQi CMS must be in English letters, and it is recommended to use lowercase letters only, avoiding special characters, spaces, or numbers at the beginning.house_type. Clear and standardized naming helps you quickly understand and refer to them during template development.

2.archiveFiltersCan the tag be used on any page template of the website?No.archiveFiltersTags are designed for document list pages or document category pages, and they depend on the page context to obtain current document model information and filtering parameters. They need to be combined witharchiveListTag usage, usually cannot be used independently in the home page or single-page templates.If you try to use it on a page that is not supported, it may cause the tags to be incorrectly parsed or the filters not to work.

If my custom field type is 'Single Line Text' or 'Multi-line Text',archiveFiltersCan it be used to generate filter options?Options list cannot be generated directly.archiveFiltersLabels are primarily used to generate clickable filter options for fields with predefined options (such as 'Single Choice', 'Multiple Choice', and 'Dropdown'). For fields of the 'Single Line Text' or 'Multi-Line Text' type, they are typically not used to generate solid