Ride AnQi CMScategoryListLabel: How to efficiently obtain the specified model and its subcategories under the parent category

In the daily operation of AnQiCMS, content classification is the core of the website structure, it not only relates to the smoothness of the user's browsing experience, but is also a key element that cannot be ignored in search engine optimization (SEO). In order to help everyone better manage and display website content, today we will delve into a very practical and powerful template tag in AnQiCMS.categoryListEspecially how to use it to obtain the list of child categories under a specified content model or a specific parent category.

AnQi CMS, with its efficient architecture based on the Go language and flexible content model design, provides an excellent content management solution for small and medium-sized enterprises and content operation teams. Understand and make good use of it.categoryListTags, they can help you build more dynamic and scalable website navigation and content structure.

categoryListOverview of tags: the foundation of content structure

categoryListThe main role of the tag is to help us extract classification data from the database and display it in a list format on the front-end page.It follows the syntax style of Django template engine, and can achieve various complex classification data calls through concise parameter configuration.

The most basiccategoryListThe usage is usually like this:

{% categoryList categories with moduleId="1" parentId="0" %}
    {# 在这里循环输出分类信息 #}
{% endcategoryList %}

Here, categoriesIt is a variable name defined by us, used to store the classified list of data obtained. The following content will be explained in detail on how to pass throughmoduleIdandparentIdThese two core parameters accurately obtain the sub-category data we want.

Accurately locate classification data: core parameter analysis

To obtain the specified content model or the subcategories under a specific parent category,categoryListThe tag provides two crucial parameters:moduleIdandparentId.

1. Specify the content model:moduleIdpower

The AnQi CMS has a major highlight, which is its 'flexible content model' feature, meaning you can create different content types according to business needs, such as 'articles', 'products', 'events', and so on.Each content model will have its own independent classification system.moduleIdThe parameters come into play.

For example, if you want to display all top-level categories under the "Article" model on the page, you need to know the corresponding "Article" model firstmoduleId(It is usually visible in the background content model management, and the system default article model ID is usually 1, the product model ID is 2). Then, you can use it like thismoduleId:

{% categoryList articleCategories with moduleId="1" parentId="0" %}
    {% for item in articleCategories %}
        <li><a href="{{ item.Link }}">{{ item.Title }}</a></li>
    {% endfor %}
{% endcategoryList %}

In this code block,moduleId="1"Make the system clearly understand that we only focus on the category data with ID 1 (i.e., the article model). If you do not specifymoduleIdThe system may attempt to retrieve all categories under all models, which may cause data confusion or not meet expectations in certain specific scenarios.

II. Retrieve the subcategories under the parent category:parentIdthe flexible application

the classification structure of the website is often multi-level, for example, under "News Center", there may be sub-categories such as "Company News" and "Industry Dynamics".parentIdThe parameter is used to control which level of child category you want to get.

  1. To get the top-level category:When you want to get all top-level categories without a parent category, you willparentIdis set to"0"Just do it.

    {% categoryList topCategories with moduleId="1" parentId="0" %}
    {# 循环输出所有文章模型的顶级分类 #}
{% endcategoryList %}

  2. Get the direct subcategories of a specific parent category:This is one of the most common application scenarios. Assume that you have already obtained a parent category in a loop (for exampleitem), now you can list its direct subcategories below the parent category by usingparentId=item.Id. Here,item.Idis the ID of the current parent category in the outer loop.

    {% categoryList mainCategories with moduleId="1" parentId="0" %}
    {% for parentItem in mainCategories %}
        <h3><a href="{{ parentItem.Link }}">{{ parentItem.Title }}</a></h3>
        <ul>
            {% categoryList subCategories with parentId=parentItem.Id %}
                {% for childItem in subCategories %}
                    <li><a href="{{ childItem.Link }}">{{ childItem.Title }}</a></li>
                {% endfor %}
            {% endcategoryList %}
        </ul>
    {% endfor %}
{% endcategoryList %}

    This code first retrieves all the top-level categories of article models, and then for each top-level category, it uses its ID asparentIdGet all subcategories at the next level. By nesting in this way, you can easily build a multi-level navigation menu.

  3. Get the direct subcategories of the current category page: If you are currently on a category list page (such as the "Company News" category page) and want to display the direct subcategories under the category, you can simply omit itparentIdParameters. The system will automatically judge the category ID of the current page and retrieve its direct subcategories.

    {# 假设当前页面是某个分类的列表页 #}
{% categoryList currentSubCategories %}
    {% for item in currentSubCategories %}
        <li><a href="{{ item.Link }}">{{ item.Title }}</a></li>
    {% endfor %}
{% endcategoryList %}

  4. Get the sibling categories (same-level categories) of the current category:In some cases, you may want to display other categories at the same level on a category page. In this case, you canparentIdis set to"parent"Please note that this usage is only valid on the current page when it is a category detail or list page.

    {# 假设当前页面是某个分类的列表页 #}
{% categoryList siblingCategories with parentId="parent" %}
    {% for item in siblingCategories %}
        <li><a href="{{ item.Link }}">{{ item.Title }}</a></li>
    {% endfor %}
{% endcategoryList %}

Practical tips: Building flexible navigation and content structure.

UnderstoodmoduleIdandparentIdThe usage, you can start building more flexible and diverse website layouts.

  • Multi-level navigation menu:Combineforloop anditem.HasChildren(Determine if the current category has subcategories) field, you can dynamically render a clear dropdown menu or sidebar navigation, greatly enhancing the user experience.

    `twig

      {% categoryList topNavs with moduleId="1" parentId="0" %}
    {% for topItem in topNavs %}
        <li {% if topItem.HasChildren %}class="has-submenu"{% endif %}>
            <a href="{{ topItem.Link }}">{{ topItem.Title }}</a>
            {% if topItem.HasChildren %}
                <ul class="submenu">
                    {% categoryList subNavs with parentId=topItem.Id %}
                        {% for subItem in subNavs %}
                            <li><a href="{{ subItem.Link }}">{{ subItem.Title }}</a></li>
                        {% endfor %}
                    {% endcategoryList %}