安企CMS模板中,如何优雅地展示指定分类下的所有子分类?
对于一个内容丰富的网站来说,清晰的分类结构是提升用户体验和搜索引擎友好度的关键。安企CMS(AnQiCMS)凭借其灵活的模板引擎和强大的标签系统,让您能够轻松地在网站前台循环遍历并展示指定分类下的所有子分类,无论是直接子分类还是多级嵌套的子分类,都能游刃有余。
今天,我们就来一起探讨如何在安企CMS的模板中实现这一功能。
理解核心:categoryList 标签
在安企CMS中,实现这一目标的核心利器就是强大的 categoryList 模板标签。这个标签专门用于获取网站的分类数据,并通过不同的参数设置,您可以精准地获取到所需的分类列表。
在使用 categoryList 标签时,有几个关键参数需要您了解:
moduleId: 这个参数用来指定您要获取哪个内容模型下的分类。例如,如果您的网站主要围绕“文章”和“产品”两种内容模型,那么“文章模型”的ID可能是1,“产品模型”的ID可能是2。您可以在安企CMS后台的“内容管理”->“内容模型”中查看各个模型的具体ID。parentId: 这是控制分类层级关系的核心参数。- 当您将其设置为
"0"时,它会获取指定模型下的所有顶级分类。 - 当您将其设置为某个分类的ID(例如
item.Id,如果item是一个已获取的分类对象),它就会获取该分类下的直接子分类。
- 当您将其设置为
siteId: 如果您开启了多站点管理,并且需要获取其他站点的数据,可以通过这个参数指定站点ID。通常情况下,我们不需要手动填写,系统会自动获取当前站点数据。all: 如果您想获取指定模型下的所有分类(不分层级),可以设置为all=true。
categoryList 标签会返回一个分类对象的数组,您可以使用 {% for ... in ... %} 循环标签来遍历这些分类,并提取它们的 Title(分类名称)、Link(分类链接)、HasChildren(是否包含子分类)等属性进行展示。
展示直接子分类:第一步
假设您有一个“新闻”分类,ID为10,现在希望在模板中列出“新闻”分类下的所有直接子分类,比如“公司新闻”、“行业动态”等。您可以这样做:
{# 首先,我们获取“新闻”分类(ID为10)下的所有直接子分类 #}
{% categoryList subCategories with moduleId="1" parentId="10" %}
<ul class="sub-category-list">
{% for category in subCategories %}
<li>
<a href="{{ category.Link }}">{{ category.Title }}</a>
</li>
{% else %}
<li>当前分类下暂无子分类。</li>
{% endfor %}
</ul>
{% endcategoryList %}
在这段代码中,moduleId="1" 假设您的新闻属于文章模型。parentId="10" 则精确指定了获取ID为10的分类的直接子分类。for 循环遍历 subCategories 数组,然后我们使用 category.Link 和 category.Title 来分别生成链接和显示分类名称。如果没有任何子分类,{% else %} 块的内容会友好地提示。
循环遍历多级子分类:实现深度嵌套
很多时候,我们的分类结构可能不止两级,而是三级、四级甚至更多。安企CMS的模板引擎支持嵌套循环,让您可以轻松地展示多级子分类。这里,我们以展示三级分类为例,您可以根据需要扩展到更深层级。
{# 获取所有顶级分类(假设 moduleId="1" 对应文章模型) #}
{% categoryList level1Categories with moduleId="1" parentId="0" %}
<ul class="level-1-categories">
{% for category1 in level1Categories %}
<li>
<a href="{{ category1.Link }}">{{ category1.Title }}</a>
{# 判断当前一级分类是否有子分类 #}
{% if category1.HasChildren %}
{# 如果有,则获取它的直接子分类,作为二级分类 #}
{% categoryList level2Categories with parentId=category1.Id %}
<ul class="level-2-categories">
{% for category2 in level2Categories %}
<li>
<a href="{{ category2.Link }}">{{ category2.Title }}</a>
{# 再次判断当前二级分类是否有子分类 #}
{% if category2.HasChildren %}
{# 如果有,则获取它的直接子分类,作为三级分类 #}
{% categoryList level3Categories with parentId=category2.Id %}
<ul class="level-3-categories">
{% for category3 in level3Categories %}
<li>
<a href="{{ category3.Link }}">{{ category3.Title }}</a>
{# 您可以在这里继续嵌套,获取四级、五级分类... #}
</li>
{% endfor %}
</ul>
{% endcategoryList %}
{% endif %}
</li>
{% endfor %}
</ul>
{% endcategoryList %}
{% endif %}
</li>
{% endfor %}
</ul>
{% endcategoryList %}
在这段代码中,我们首先获取所有 parentId="0" 的顶级分类。在遍历每个顶级分类(category1)时,我们使用 {% if category1.HasChildren %} 来判断它是否拥有子分类。如果存在子分类,我们再通过嵌套的 categoryList 标签,将 parentId 设置为当前分类的ID(例如 category1.Id),以此来逐级获取并展示下级分类。这种模式可以灵活地扩展到您网站所需的任何分类深度。
一些小提示和**实践
- 模板文件位置:您应该将这些模板代码放在安企CMS模板目录下的
.html文件中,例如template/您的模板名称/partial/category_nav.html,然后可以在主模板中使用{% include "partial/category_nav.html" %}来引用。 - 获取当前页面的分类ID:如果您想获取当前页面所属分类的子分类,可以使用
{{category.Id}}(在分类详情页)或者{{archive.CategoryId}}(在文档详情页)来作为parentId的值。 - 优化展示:除了
Title和Link,分类对象还提供了Logo(分类大图)、Thumb(分类缩略图)、Description(分类描述)等属性。您可以根据设计需求,在<a>标签内或旁边添加图片、描述等信息,丰富分类的展示效果。 - 性能考量:虽然安企CMS基于Go语言,具有高性能特点,但在极端复杂的深层嵌套和大量数据场景下,过多的嵌套循环可能会对前端渲染速度产生轻微影响。通常情况下,对于网站常见的3-5级分类深度,这种方式是高效且无忧的。
通过以上方法,您就能灵活地在安企CMS的模板中,按照您的设计需求,循环遍历并展示网站的所有子分类,为访客提供清晰直观的导航体验。
常见问题 (FAQ)
1. 如何在模板中判断一个分类是否有子分类?
您可以在循环遍历分类项时,使用 {% if item.HasChildren %} 来进行判断。HasChildren 是分类对象的一个布尔值属性,如果为 true 则表示该分类有下级子分类。
2. 我想展示分类下的所有文档,而不是子分类列表,应该用哪个标签?
如果您想获取指定分类(或包含其子分类)下的文档列表