AnQiCMS 模板中导航列表及其子菜单的获取与展示
作为一名资深的安企CMS网站运营人员，我深知一套清晰、高效的网站导航对于用户体验和内容触达的重要性。安企CMS为模板开发者提供了强大且灵活的导航列表标签navList，使得我们能够轻松地在网站前端获取并展示主导航、页脚导航乃至更复杂的带有子菜单的多级导航结构。
获取网站导航列表
在安企CMS模板中，我们通过内置的navList标签来获取网站的导航数据。这个标签设计得非常直观，它允许我们定义一个变量来存储导航数据，然后通过循环遍历这个变量来渲染导航结构。最基本的用法是{% navList navs %}...{% endnavList %}，其中navs是我们为导航列表指定的变量名，您可以根据自己的偏好命名。
navList标签支持几个重要的参数，用于精细控制您希望获取的导航数据。其中，typeId参数尤为关键。在安企CMS的后台管理界面，您可以在“网站导航设置”下的“导航类别管理”中创建并管理不同的导航类别，例如“顶部主导航”、“页脚导航”、“侧边栏导航”等，每个类别都有一个唯一的typeId。通过在navList标签中指定typeId="您的导航类别ID"，您就可以准确地调用特定区域的导航数据。如果未指定typeId，系统默认会获取ID为1的导航类别，通常是主导航。此外，在多站点管理场景下，您还可以使用siteId参数来指定调用特定站点的数据，确保不同站点内容的独立性。
遍历与展示导航项
一旦通过navList标签获取了导航数据，navs变量就会成为一个包含所有导航项的数组对象。为了在模板中展示这些导航项，我们需要使用for循环来逐一遍历它们。在循环体内，每个导航项会作为item变量暴露出来，我们可以访问其各种属性来构建导航链接。
每个item对象提供了丰富的字段，帮助我们构建完整的导航链接。其中最常用的是Title（导航显示名称）、Link（导航链接地址）和IsCurrent（判断当前链接是否为激活状态）。利用IsCurrent属性，我们可以为当前访问的页面所对应的导航项添加特定的CSS类（例如active），从而在视觉上高亮显示，提升用户体验。
例如，一个简单的顶层导航菜单可以这样构建：
<ul class="main-nav">
{% navList navs %}
{% for item in navs %}
<li class="nav-item {% if item.IsCurrent %}active{% endif %}">
<a href="{{ item.Link }}">{{ item.Title }}</a>
</li>
{% endfor %}
{% endnavList %}
</ul>
展示子菜单结构
安企CMS的navList标签不仅支持获取顶层导航，还能轻松处理多级子菜单。每个导航item对象中都可能包含一个名为NavList的属性，这正是其子菜单的集合。NavList同样是一个数组对象，这意味着我们可以通过嵌套的for循环来遍历并展示子菜单项。
在处理子菜单时，一个常见的做法是先判断当前item是否存在NavList。如果item.NavList不为空，则说明该导航项拥有子菜单，此时我们可以渲染一个下拉菜单或多级菜单结构。这种判断通常使用{% if item.NavList %}来实现。
结合判断逻辑和嵌套循环，我们可以构建一个典型的二级导航菜单：
<ul class="main-nav">
{% navList navs %}
{% for item in navs %}
<li class="nav-item {% if item.IsCurrent %}active{% endif %}">
<a href="{{ item.Link }}">{{ item.Title }}</a>
{% if item.NavList %} {# 判断是否存在子菜单 #}
<ul class="submenu">
{% for inner in item.NavList %} {# 遍历子菜单 #}
<li class="submenu-item {% if inner.IsCurrent %}active{% endif %}">
<a href="{{ inner.Link }}">{{ inner.Title }}</a>
</li>
{% endfor %}
</ul>
{% endif %}
</li>
{% endfor %}
{% endnavList %}
</ul>
结合内容展示的复杂导航
在实际运营中，导航栏有时需要展示更丰富的内容，例如在产品分类下直接显示热门产品列表，或者在关于我们菜单下显示子分类链接。安企CMS的navList标签与archiveList（文档列表）和categoryList（分类列表）等标签的结合使用，使得实现这些复杂需求成为可能。
item对象中的PageId字段扮演着重要的角色。当一个导航菜单项链接到后台配置的某个分类或页面时，PageId会存储该分类或页面的ID。利用这个ID，我们可以在子菜单中动态地调用相应分类下的文档列表或进一步的子分类列表。
例如，在一个产品导航项的下拉菜单中，除了显示常规的子分类，我们还可以展示该分类下的部分产品：
<ul class="main-nav">
{% navList navList with typeId=1 %} {# 假设 typeId=1 是主导航 #}
{% for item in navList %}
<li class="nav-item">
<a href="{{ item.Link }}">{{ item.Title }}</a>
{% if item.NavList %}
<ul class="nav-menu-child">
{% for inner in item.NavList %} {# 遍历二级导航 #}
<li>
<a href="{{ inner.Link }}">{{ inner.Title }}</a>
{# 如果二级导航项链接的是一个分类，且 PageId > 0 #}
{% if inner.PageId > 0 %}
{% archiveList products with type="list" categoryId=inner.PageId limit="8" %} {# 调用该分类下的8个产品 #}
{% if products %}
<ul class="nav-menu-grandchild">
{% for product in products %}
<li><a href="{{ product.Link }}">{{ product.Title }}</a></li>
{% endfor %}
</ul>
{% endif %}
{% endarchiveList %}
{% endif %}
</li>
{% endfor %}
</ul>
{% endif %}
</li>
{% endfor %}
{% endnavList %}
</ul>
通过这种灵活的组合方式，我们能够根据网站的具体需求，构建出既美观又实用的多级导航系统，极大地提升用户浏览体验和网站的信息架构效率。
总结
安企CMS的navList标签为网站导航的构建提供了极大的便利和灵活性。从简单的单级菜单到复杂的带有子菜单、甚至动态内容展示的多级导航，我们都可以通过合理地运用typeId参数、for循环以及与其他标签的组合，实现多样化的导航需求。作为网站运营人员，掌握这些模板标签的使用，是提升网站用户体验和内容管理效率的关键。
常见问题解答
1. 如何在安企CMS后台创建和管理不同的导航类别？
您可以在安企CMS后台导航菜单中找到“后台设置” -> “网站导航设置”选项。在这里，您可以进入“导航类别管理”页面，添加新的导航类别，例如“页脚导航”、“手机端导航”等，并为每个类别分配一个唯一的ID。创建好类别后，您可以在“导航链接设置”中选择相应的类别，为它添加具体的导航链接项及其子菜单。
2. 为什么我的二级菜单没有显示出来？
请检查几个方面。首先，确保在安企CMS后台的“网站导航设置”中，您已经为主导航项添加了子菜单。其次，检查模板代码中是否存在{% if item.NavList %}这样的判断条件，如果缺少这个判断，或者判断逻辑有误，子菜单将不会被渲染。此外，确认您的子菜单项的item.NavList属性是否正确地包含了子菜单数据。
3. 如何为导航项添加自定义的图标或描述信息？
在安企CMS后台的“网站导航设置” -> “导航链接设置”中，除了标题和链接，您还可以为每个导航项填写“子标题名称”和“导航描述”。这些信息在模板中可以通过item.SubTitle和item.Description来获取和展示。对于图标，您通常需要在后台添加一个自定义字段（如果系统默认不支持图标上传），或者在前端通过CSS为特定导航项添加图标样式。