在AnQiCMS中构建一个清晰、有条理的网站导航,特别是处理多级分类时,是提升用户体验和网站可访问性的关键。categoryList 标签正是为此而生,它提供了强大的功能,帮助我们灵活地展示分类的层级结构,并进行精细化的嵌套调用。

理解 categoryList 标签的基础

categoryList 标签是AnQiCMS模板引擎中的一个核心组件,用于从后台获取文章或产品的分类列表。它的基本用法简洁明了,但通过搭配不同的参数,可以实现极其丰富的展示效果。

典型的用法如下所示:

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

这里面有几个关键参数:

  • moduleId: 这个参数非常重要,它指定了你想获取哪个内容模型(例如文章模型或产品模型)下的分类。AnQiCMS支持自定义内容模型,每个模型都有其独立的分类体系。
  • parentId: 这是控制分类层级显示的核心参数。
    • 当设置为 parentId="0" 时,它会获取指定 moduleId 下的所有顶级分类。
    • 当你在一个循环中,希望获取当前分类的子分类时,可以动态地将 parentId 设置为 item.Id,其中 item 是当前循环中的分类对象。
  • limit: 用于限制显示分类的数量,比如 limit="10" 会只显示10条分类。
  • siteId: 在多站点管理模式下,如果你需要调用其他站点的数据,可以通过这个参数指定站点ID。

{% for item in categories %} 循环中,我们可以访问每个分类的属性,例如:

  • item.Id: 分类ID
  • item.Title: 分类名称
  • item.Link: 分类链接
  • item.ParentId: 上级分类ID
  • item.HasChildren: 一个布尔值,表示该分类是否有子分类,这在进行嵌套判断时非常有用。
  • item.Spacer: 用于视觉上创建层级缩进的前缀,方便展示树形结构。

实现多级分类的层级显示和嵌套调用

多级分类的魅力在于它能将复杂的网站结构以清晰的方式呈现给用户。在AnQiCMS中,通过巧妙地在 categoryList 标签内嵌套 categoryList 标签,我们可以轻松构建出任意深度的分类层级。

核心思路是:使用一个外层 categoryList 标签获取顶级分类,然后在其循环内部,再嵌套使用 categoryList 标签,并将内层标签的 parentId 参数设置为外层分类的 Id 这样,内层标签就会自动获取到外层分类的子分类。

让我们看一个实现三级分类嵌套调用的例子:

{# 外层标签:获取所有顶级分类,moduleId="1"代表文章模型 #}
{% categoryList topCategories with moduleId="1" parentId="0" %}
<ul>
    {% for item in topCategories %}
    <li>
        {# 显示一级分类 #}
        <a href="{{ item.Link }}">{{ item.Title }}</a>

        {# 判断当前一级分类是否有子分类,如果有,则继续嵌套显示 #}
        {% if item.HasChildren %}
        <div>
            {# 内层标签1:获取当前一级分类的子分类。parentId=item.Id 是关键 #}
            {% categoryList subCategories1 with parentId=item.Id %}
            <ul>
                {% for inner1 in subCategories1 %}
                <li>
                    {# 显示二级分类 #}
                    <a href="{{ inner1.Link }}">{{ inner1.Title }}</a>

                    {# 判断当前二级分类是否有子分类,如果有,则继续嵌套显示 #}
                    {% if inner1.HasChildren %}
                    <div>
                        {# 内层标签2:获取当前二级分类的子分类 #}
                        {% categoryList subCategories2 with parentId=inner1.Id %}
                        <ul>
                            {% for inner2 in subCategories2 %}
                            <li>
                                {# 显示三级分类 #}
                                <a href="{{ inner2.Link }}">{{ inner2.Title }}</a>
                            </li>
                            {% endfor %}
                        </ul>
                        {% endcategoryList %}
                    </div>
                    {% endif %}
                </li>
                {% endfor %}
            </ul>
            {% endcategoryList %}
        </div>
        {% endif %}
    </li>
    {% endfor %}
</ul>
{% endcategoryList %}

在这个例子中:

  1. 第一个 categoryList (变量名为 topCategories)通过 parentId="0" 获取所有顶级分类。
  2. topCategories 的循环内部,我们使用 {% if item.HasChildren %} 来判断当前一级分类是否有子分类。
  3. 如果存在子分类,则嵌套第二个 categoryList (变量名为 subCategories1),此时 parentId 被动态设置为 item.Id,即当前一级分类的ID,从而获取其直接子分类。
  4. 同样,在 subCategories1 的循环内部,我们再次判断 inner1.HasChildren,如果存在,则继续嵌套第三个 categoryList (变量名为 subCategories2),parentId 再次被动态设置为 inner1.Id,获取二级分类的子分类。

通过这种方式,我们可以在模板中灵活地构建出清晰、可扩展的分类导航结构,无论是网站主导航、侧边栏导航还是网站地图,都能轻松应对。

实际应用与进阶技巧

除了纯粹的分类层级显示,categoryList 还可以与 archiveList 等其他标签结合,实现更强大的功能:

  1. 分类下显示文档列表: 在遍历分类时,我们可能希望同时显示该分类下的部分文章或产品。

    {% categoryList categories with moduleId="1" parentId="0" %}
    <div>
        {% for item in categories %}
        <h3><a href="{{ item.Link }}">{{ item.Title }}</a></h3>
        <ul>
            {# 在每个分类下,调用该分类下的文档列表 #}
            {% archiveList archives with type="list" categoryId=item.Id limit="6" %}
            {% for archive in archives %}
            <li><a href="{{ archive.Link }}">{{ archive.Title }}</a></li>
            {% empty %}
            <li>暂无文档</li>
            {% endfor %}
            {% endarchiveList %}
        </ul>
        {% endfor %}
    </div>
    {% endcategoryList %}
    

    这个例子展示了如何在一个循环中获取顶级分类,并在每个分类下显示其最新的6篇文档,大大丰富了页面的内容展示。

  2. 利用 HasChildren 字段优化显示: 在构建导航时,可以根据 HasChildren 字段智能地决定是显示子分类,还是直接显示当前分类下的文档。

    {% categoryList productCategories with moduleId="2" parentId="0" %}
    <nav>
        {% for item in productCategories %}
        <a href="{{ item.Link }}">{{ item.Title }}</a>
        <ul class="sub-nav">
            {% if item.HasChildren %}
                {# 如果有子分类,则显示子分类 #}
                {% categoryList subCategories with parentId=item.Id %}
                {% for inner in subCategories %}
                <li><a href="{{ inner.Link }}">{{ inner.Title }}</a></li>
                {% endfor %}
                {% endcategoryList %}
            {% else %}
                {# 如果没有子分类,则显示该分类下的产品文档 #}
                {% archiveList products with type="list" categoryId=item.Id limit="8" %}
                {% for inner in products %}
                <li><a href="{{ inner.Link }}">{{ inner.Title }}</a></li>
                {% endfor %}
                {% endarchiveList %}
            {% endif %}
        </ul>
        {% endfor %}
    </nav>
    {% endcategoryList %}
    

    这种方式使得导航更具动态性,能够根据分类结构的变化自动调整显示内容。

通过上述方法,您可以充分利用AnQiCMS categoryList 标签的强大功能,构建出既美观又实用的多级分类导航,为您的网站访客提供卓越的浏览体验。


常见问题 (FAQ)

  1. 如何限制多级分类显示的深度? 您可以通过控制嵌套 categoryList 标签的层数来限制显示的深度。例如,如果您只需要显示三级分类,就像本文的第一个例子那样,那么您就只需要嵌套两层 categoryList 标签。如果某个分类层级下没有子分类,item.HasChildren 将为 false,内层循环自然不会执行,从而避免显示空层级。

  2. 我能否在分类循环中获取该分类的父级分类信息? 直接在子分类的循环中获取其 直接父级 的所有信息是可以通过 item.ParentId 字段来完成的,但若要获取父级的具体 TitleLink,您需要结合 categoryDetail 标签,例如 {% categoryDetail parentCategory with name="Title" id=item.ParentId %}{{parentCategory}}

  3. 如果我只想显示特定数量的顶级分类,但其子分类全部显示,该如何操作? 您可以在最外层的 categoryList 标签中使用 limit 参数来限制顶级分类的数量,例如 {% categoryList topCategories with moduleId="1" parentId="0" limit="5" %}。其内部的嵌套 categoryList 标签则无需设置 limit,它们会默认获取所有符合条件的子分类。