In AnQiCMS, using document parameters to build flexible filtering conditions and display the filtering results is a key factor in improving website user experience and content management efficiency.This can not only help users find the required information faster, but also make the website content structure more clear.This article will thoroughly introduce how to implement this feature in the Anqi CMS, from the initial parameter definition to the final selection and display, helping you easily manage the content.

Make content smarter: How to巧妙运用document parameters to achieve filtering function in AnQi CMS

How to help visitors quickly and accurately find the information they are interested in, has become a common challenge for website operators as the content of the website continues to enrich.English CMS provides us with an elegant solution with its flexible content model and powerful template tag features—building filters through custom document parameters.Imagine a real estate website that can filter listings based on conditions such as 'house type', 'area', and 'region', and an e-commerce platform that can filter products based on attributes such as 'color', 'size', and 'brand'. All of these rely on the exquisite application of document parameters.

Next, let us uncover the mysterious veil of achieving this function step by step in AnQi CMS.

One、Preparation: Define document parameters

To implement the filtering function, you first need to define the filter parameters for your content.One of the core advantages of AnQi CMS lies in its flexible content model, which is the foundation for our filtering function.

  1. Enter the content model management:Log in to the Anqi CMS backend, navigate to the "Content ManagementHere, you can manage and edit the models used for various types of content on your website (such as articles, products, etc.)
  2. Edit or create a new content model:Select an existing content model that you want to add filtering functions to for editing, or create a brand new content model.
  3. Add custom fields:In the content model editing interface, you will see the 'Content Model Custom Fields' area.Click 'Add field', define filter parameters for your content.Here, the key is to choose the appropriate 'field type', especially the types of 'single choice', 'multiple choice', and 'drop-down selection', which are very suitable as filtering conditions.
    • Parameter name:This is the field name displayed to the user on the front end, such as “Type” or “Color”.
    • Field call:This is the unique identifier used to refer to the parameter in the template code, please use letters, such as “houseType”、“color”.
    • Field Type:Choose 'Single Choice', 'Multiple Choice', or 'Dropdown Choice'.
    • Default value:Enter the filtering option values here, one per line.For example, if the "apartment type" field has options such as "one-bedroomThese values will be directly used as clickable filter conditions.

After defining the field, remember to save the content model.Next, when publishing or editing a document, you can fill in the corresponding values for these custom fields.These values will be used as document properties, becoming the target for future filtering.

Second, build the filter interface: usearchiveFilterstags

With defined document parameters, the next step is how to present these parameters on the front-end page for user selection and filtering. The Anqi CMS provides specialarchiveFiltersLabel to help us automate the construction of this complex filter interface.

  1. Determine the placement position of the label: archiveFiltersLabels are usually placed in the document list page or the home template of the document model, that is, the page where users need to filter the content when browsing.
  2. UsearchiveFiltersTags:This tag can automatically read the content model custom fields you define in the background and generate the corresponding filter links. It mainly needs amoduleIdParameters to specify which content model document you want to filter.
    • moduleId: Specify the content model ID of the document you want to filter. For example,moduleId="1"可能代表文章模型，moduleId="2"It may represent a product model. You can find the corresponding ID on the content model management page.
    • allText：Used to set the display text for default options such as “All” or “Unlimited”, if you do not want to display this default option, you can set it tofalse.

The following is a simple code example demonstrating how to usearchiveFilterstags to generate filters:

{# 假设我们正在为一个ID为1的内容模型（如文章）创建筛选器 #}
<div class="filter-section">
    <div class="filter-title">参数筛选：</div>
    {% archiveFilters filters with moduleId="1" allText="全部" %}
        {% for item in filters %}
        <ul class="filter-group">
            <li class="filter-name">{{item.Name}}: </li> {# 显示参数名称，如“户型” #}
            {% for val in item.Items %}
            <li class="filter-option {% if val.IsCurrent %}active{% endif %}">
                <a href="{{val.Link}}">{{val.Label}}</a> {# 生成带有筛选参数的URL链接 #}
            </li>
            {% endfor %}
        </ul>
    {% endfor %}
    {% endarchiveFilters %}
</div>

In this example,filtersis an array containing all filterable parameters.item.NameIt will display the parameter name you set in the background (such as “Type”),(item.Itemswhich is an array containing all the options of the parameter. For each option,val.LabelIs the text displayed to the user (such as "One bedroom"), andval.LinkIt is the complete URL generated automatically by the Safety CMS, which includes the filtering conditions.val.IsCurrentThen it is used to judge whether the current option is selected, making it convenient for you to add styles.

Three, display the filtering results:archiveListuses

The user clicks the filter conditions, and the page needs to dynamically display the corresponding document list based on these conditions. The Anqi CMS'sarchiveListThe label plays a core role here, as it can intelligently capture the filtering parameters in the URL, query the database accordingly, and return documents that meet the criteria.

  1. archiveListAutomatic response to filtering conditions: archiveListThe tag itself does not require additional settings to “receive” filtering parameters. WhenarchiveFiltersThe generated link is clicked, the URL will contain something similar to?houseType=one_bedroom&color=redsuch query parameters.archiveListThe tag will receive data whenAutomatic identification and applicationThese parameters in the URLs are used as filtering conditions.
  2. Combined with pagination feature:To better manage the filtered results, we usually combine pagination tagspaginationtogether.archiveListTagstype="page"The parameter indicates enabling pagination functionality.

The following is a complete code example that combines the filter with the document list and pagination functionality:

`twig {# Filter