作为一位资深的网站运营专家,我深知一个灵活、高效的内容管理系统对于网站成功的价值。安企CMS(AnQiCMS)凭借其基于Go语言的高性能架构和Django风格的模板引擎,为内容展示带来了极大的便利与无限可能。今天,我们就来深入探讨一个在实际运营中非常常见的需求:如何在AnQiCMS模板中实现多级分类的嵌套显示,让你的网站结构更加清晰,用户体验更上一层楼。

组织内容的基石:理解AnQiCMS的分类结构

在深入模板代码之前,我们首先需要理解AnQiCMS在后台是如何组织分类的。安企CMS的核心优势之一就是其“灵活的内容模型”,它允许我们为不同类型的内容(如文章、产品)创建独立的分类体系。每个分类在创建时,都可以指定其所属的“上级分类”,这就天然地构建了层级关系。例如,你可以有一个“新闻中心”作为一级分类,在其下设“行业新闻”和“公司动态”作为二级分类,再往下,如果需要,甚至可以设置三级分类。这种层级关系是我们在模板中实现嵌套显示的基础。

在后台管理界面,我们可以看到每个分类不仅有名称、简介,还有一些重要的属性,比如它所属的“文档模型”以及最重要的“上级分类”ID。同时,AnQiCMS还允许我们为分类设置自定义URL、缩略图乃至专属的“分类模板”,这些都为我们后续的模板设计提供了丰富的可操作性。

模板引擎的艺术:Django-like语法的妙用

AnQiCMS的模板制作非常友好,它采用了类似Django的模板引擎语法。这意味着你可以使用直观的标签来控制内容的显示逻辑。变量的输出通常使用双花括号{{ 变量名 }},而逻辑判断和循环控制则使用单花括号和百分号{% 标签 %}。对于多级分类的嵌套显示,核心的工具就是for循环标签和if条件判断标签,它们将帮助我们遍历分类数据,并根据其层级关系进行有条件地渲染。

实现多级分类嵌套的核心:categoryList标签

要在AnQiCMS模板中展示分类列表,我们主要依赖的是categoryList标签。这个标签功能强大,能够获取文章或产品的分类数据,并支持灵活的筛选条件。

categoryList标签的关键参数包括:

  • moduleId:用于指定我们要获取哪个内容模型(如文章模型ID为1,产品模型ID为2)的分类。
  • parentId:这是实现嵌套显示的核心。当设置为"0"时,它会获取所有顶级分类;而当我们希望获取某个特定分类的子分类时,就可以将parentId设置为该父分类的Id
  • all:如果设置为true并结合moduleId,可以获取指定模型下的所有分类,无论层级。

categoryList标签会返回一个包含分类对象的数组。在for循环中,每个分类对象(我们通常将其命名为item)都包含了诸多有用的属性,例如:

  • Id:分类的唯一ID。
  • Title:分类的名称。
  • Link:分类页面的链接。
  • ParentId:上级分类的ID。
  • HasChildren:一个布尔值,指示当前分类是否包含子分类。这个属性在构建嵌套结构时尤为重要,可以用来判断是否需要渲染下一级菜单。
  • Spacer:一个用于在后台显示层级关系的缩进前缀,前端显示时通常用不上,但可以辅助理解层级。

逐步构建嵌套分类模板

让我们通过一个具体的例子,来展示如何利用categoryList标签实现三级分类的嵌套显示。

假设我们希望展示文章模型(moduleId="1")下的所有分类,并以嵌套列表的形式呈现:

{%- comment -%} 首先,我们获取所有顶级分类 (parentId="0") {%- endcomment -%}
{% categoryList categories with moduleId="1" parentId="0" %}
<ul>
    {%- for item in categories %}
    <li>
        <a href="{{ item.Link }}">{{item.Title}}</a>
        {%- comment -%} 检查当前分类是否有子分类,如果有,则继续获取下一级 {%- endcomment -%}
        {%- if item.HasChildren %}
        {%- comment -%} 获取当前一级分类的子分类,将当前分类的ID (item.Id) 作为下一级的 parentId {%- endcomment -%}
        {% categoryList subCategories with parentId=item.Id %}
        <ul>
            {%- for inner1 in subCategories %}
            <li>
                <a href="{{ inner1.Link }}">{{inner1.Title}}</a>
                {%- comment -%} 再次检查当前二级分类是否有子分类 {%- endcomment -%}
                {%- if inner1.HasChildren %}
                {%- comment -%} 获取当前二级分类的子分类,将当前二级分类的ID (inner1.Id) 作为下一级的 parentId {%- endcomment -%}
                {% categoryList subCategories2 with parentId=inner1.Id %}
                <ul>
                    {%- for inner2 in subCategories2 %}
                    <li>
                        <a href="{{ inner2.Link }}">{{inner2.Title}}</a>
                    </li>
                    {%- endfor %}
                </ul>
                {%- endcategoryList %}
                {%- endif %}
            </li>
            {%- endfor %}
        </ul>
        {%- endcategoryList %}
        {%- endif %}
    </li>
    {%- endfor %}
</ul>
{%- endcategoryList %}

在这段代码中,我们巧妙地运用了嵌套的categoryList标签和for循环:

  • 最外层的categoryList负责获取顶级分类。
  • 在每个顶级分类的循环内部,我们使用{% if item.HasChildren %}来判断它是否有子分类。
  • 如果存在子分类,我们再调用一次categoryList,但这次将parentId设置为当前父分类的{{ item.Id }},从而获取下一级分类。
  • 这个过程可以根据你的实际需求,无限嵌套下去,直到所有层级的分类都被展示出来。

实战进阶:结合导航列表的嵌套

除了直接展示分类,我们网站的导航菜单也常常需要呈现多级分类。AnQiCMS的navList标签同样支持多级嵌套,并且可以非常方便地与分类数据结合,实现动态导航。

navList标签中,每个导航项item都有一个NavList属性,它本身也是一个数组,包含了当前导航项的子导航。如果导航项是链接到某个分类页面的,它的