Hello! As an experienced website operations expert, I am very willing to give you a detailed interpretation of AnQi CMS incategoryListThe powerful function of tags, especially how to accurately retrieve all top-level category lists on your website.Understand and apply this label, it will be a key step in building a clear and efficient website navigation system.

AnQi CMS实战：How to usecategoryListTags, easily present the top-level classification navigation of the website

In a content management system, categories are the core framework for organizing information and guiding users to browse.No matter whether it is an article, product, or any other type of content, a clear classification structure can greatly enhance user experience and search engine friendliness.AnQiCMS (AnQiCMS) leverages its flexible content model design, making category management effortless.And all of this, cannot be separated from a crucial template tag -categoryList.

Today, we will delve into how to巧妙运用 cleverlycategoryListLabels, accurately obtain all top-level category lists on the website, to build a solid and intuitive navigation foundation for your website.

Core function analysis:categoryListWhat is a label?

categoryListThe tag is a powerful and flexible tool provided by the Anqi CMS template engine, which is mainly responsible for extracting and presenting classified information from the database.With it, you can filter out the required category list based on different conditions, such as generating the main navigation menu, sidebar category tree, or the category index at the bottom of the website.It can help you avoid the cumbersome work of manually maintaining a category list and achieve dynamic updates of the website structure.

Get all top-level categories:parentId="0"withmoduleIdSkillful collaboration

To get all top-level categories on the website, you need to understandcategoryListThe two core parameters of the tag:parentIdandmoduleId.

  1. parentId="0":Filter the highest level parentIdThe parameter is used to specify the parent category ID to be retrieved. When you useparentIdThe value is set to"0"At that time, you are actually telling the Anq CMS system: 'I only want those categories without parent categories, that is, the highest level categories.'These categories are usually the first-level categories in your website content system, and they are the roots of all subcategories.

  2. moduleId: Content model restrictionOne of the major advantages of AnQi CMS lies in its highly customizable content model.Your website may have multiple content models such as "articles", "products", "downloads", etc., each with its own independent classification system.To ensure that you get the correct top-level category of content model, you must pass throughmoduleIdto explicitly specify. For example, if the ID of your “Article Model” is1, and the ID of the “Product Model” is2You need to pass the corresponding ID according to your needs.

Combine these two parameters, and we can accurately filter out all top-level categories under a specific content model. Below is an actual template code example:

<nav>
    <ul>
        {# 假设文章模型的ID是1，这里获取所有顶级文章分类 #}
        {% categoryList topArticleCategories with moduleId="1" parentId="0" %}
            {% for category in topArticleCategories %}
                <li><a href="{{ category.Link }}">{{ category.Title }}</a></li>
            {% endfor %}
        {% endcategoryList %}

        {# 假设产品模型的ID是2，这里获取所有顶级产品分类 #}
        {% categoryList topProductCategories with moduleId="2" parentId="0" %}
            {% for category in topProductCategories %}
                <li><a href="{{ category.Link }}">{{ category.Title }}</a></li>
            {% endfor %}
        {% endcategoryList %}
    </ul>
</nav>

In this example,topArticleCategoriesandtopProductCategoriesThis is the variable name we custom for list data, you can name it according to your habit.{% for category in ... %}The loop will iterate over each top-level category obtained and assign its data tocategoryThis temporary variable is convenient for us to display later.

Understand classification data:categoryListThe returned treasure

WhencategoryListThe tag successfully retrieves the category data and then returns an array containing multiple category objects.Each category object encapsulates rich attribute information, and you can flexibly call it in the template according to your needs.Here are some of the most commonly used properties:

  • Id: Unique identifier for classification, often used for internal logic judgment or link construction.
  • TitleThe category name, which is the most intuitive category title for users.
  • LinkThe URL address of the category page, used directly to build navigation links.
  • Description: A brief description of the category, which can be used in hover tips or SEO metadata.
  • LogoandThumb: Cover image and thumbnail of the category, suitable for navigation or category lists that require image display.
  • HasChildrenA boolean value (trueorfalseIndicates whether the current category has subcategories. This is very useful for building interactive effects for multi-level dropdown menus.
  • ArchiveCountThe number of items (articles, products, etc.) contained in this category, which can be used to display the richness of the category content.

By these properties, you can easily build a beautiful and functional top-level category navigation.

Practical application: Build a clear top-level navigation.

Now, let's integrate the above knowledge points and see a more complete scenario of building a top-level navigation. Suppose we want to display the top-level categories of articles and product modules in the header of the website and add visual hints for items with subcategories: 

<header>
    <nav class="main-navigation">
        <ul>
            {# 获取文章模块的顶级分类 #}
            {% categoryList articleNav with moduleId="1" parentId="0" %}
                {% for category in articleNav %}
                    <li class="nav-item {% if category.HasChildren %}has-dropdown{% endif %}">
                        <a href="{{ category.Link }}">{{ category.Title }}</a>
                        {# 如果有下级分类，可以进一步在这里渲染子菜单，这里只是一个占位符 #}
                        {% if category.HasChildren %}
                            <span class="dropdown-icon">▼</span>
                            {# 这里可以嵌套另一个 categoryList 标签来获取子分类 #}
                            {# 例如：{% categoryList subCategories with parentId=category.Id %}{# ... #}{% endcategoryList %} #}
                        {% endif %}
                    </li>
                {% endfor %}
            {% endcategoryList %}

            {# 获取产品模块的顶级分类 #}
            {% categoryList productNav with moduleId="2" parentId="0" %}
                {% for category in productNav %}
                    <li class="nav-item {% if category.HasChildren %}has-dropdown{% endif %}">
                        <a href="{{ category.Link }}">{{ category.Title }}</a>
                        {% if category.HasChildren %}
                            <span class="dropdown-icon">▼</span>
                            {# 同样，这里可以嵌套获取子分类 #}
                        {% endif %}
                    </li>
                {% endfor %}
            {% endcategoryList %}
        </ul>
    </nav>
</header>

This code not only demonstrates how to obtain the top-level categories, but also introducesHasChildrenThe property allows you to add specific styles or interactive effects to navigation items containing subcategories, thereby building a more hierarchical website navigation. You can further nest as neededcategoryListTag, to implement the display of multi-level categories.

Advanced usage tips

  • Control the number of displayed items:limitParameterIf you only want to display a selected few top-level categories, you can uselimitparameter to limit the number, for example:limit="5"This is very useful in scenarios such as 'Hot Categories' on the homepage.

  • Multi-site scenario:siteIdParameterAnQiCMS supports multi-site management. If you are running multiple websites under an AnQiCMS instance and need to call category data from different sites, you can usesiteIdParameters to specify which site's category list to retrieve. For example:with siteId="2" moduleId="1" parentId="0".

  • Sorting:orderParameterAlthough it is usually in the default order set by the background when retrieving top-level categories,categoryListalso supportsorderParameters allow you to specify according toid/sort(Custom sort) and other sorting to make the display order of categories more in line with your operational strategy.

By processingcategoryListA deep understanding and flexible application of tags, you will be able to efficiently manage and display the classification structure of the website, provide your users with a better browsing experience, and lay a solid foundation for the website's SEO.

Frequently Asked Questions (FAQ)

  1. Ask: Why did I useparentId="0"HowevercategoryListThe tag still does not display any categories? Answer:The most common reason is that you may have forgotten to specify it at the same timemoduleIdThe parameter. Anqi CMS has various content models, each with its own classification system.If you do not tell the system which content model's top-level category you want to retrieve, it cannot find matching data.Make sure your tags include bothmoduleId="X"of whichXis the ID of the content model you need.

  2. Ask: How do I get all categories under a specific content model, regardless of whether they are top-level categories? Answer:If you want to get a certain