作为一名资深的安企CMS网站运营人员，我深知清晰、直观的网站导航对于提升用户体验和搜索引擎优化至关重要。AnQiCMS提供了强大而灵活的导航管理功能，无论您需要为网站顶部、底部还是侧边栏创建菜单，都能轻松实现。本文将详细阐述如何在AnQiCMS中创建和管理不同类型的网站导航。
理解AnQiCMS的导航核心概念
在AnQiCMS中，网站导航的构建主要围绕两个核心概念展开：导航类别（Navigation Categories）和导航链接（Navigation Links）。导航类别是用于区分网站上不同导航区域的容器，例如“顶部导航”、“页脚导航”或“侧边栏导航”。每个类别内部包含一个或多个导航链接，这些链接构成了用户实际点击的菜单项，指向网站的不同页面或外部资源。
创建和管理导航类别
首先，您需要进入AnQiCMS的后台管理界面，通过“后台设置”菜单进入“导航设置”页面。在这里，您会看到“导航类别管理”部分。系统默认会提供一个“默认导航”类别，但为了更好地组织网站结构，建议您根据实际需求创建新的导航类别。
要添加一个新的导航类别，只需点击“新增导航类别”按钮。例如，如果您计划为网站底部创建一个菜单，可以添加一个名为“页脚导航”的新类别。创建类别后，您就可以独立地为该类别配置导航链接，确保网站不同区域的菜单内容互不干扰、管理有序。
配置导航链接的详细步骤
在“导航设置”页面的“导航链接设置”部分，您可以为已创建的导航类别添加和编辑具体的菜单项。每一个导航链接都提供了丰富的配置选项，以满足多样化的网站导航需求：
- 上级导航： AnQiCMS支持最多两级导航链接。如果您希望创建一个主菜单项，请选择“顶级导航”作为其上级。如果该链接是二级菜单项，则从下拉列表中选择其所属的一级菜单。这使得创建结构化的多级菜单变得简单直观。
- 显示名称： 这是用户在网站前端看到的菜单文字。您可以根据需要自由修改，不必与链接指向的页面标题完全一致，以优化用户体验和表述的简洁性。
- 子标题名称： 某些设计可能需要在主标题下方显示一个副标题或辅助文字。通过填写此项，可以在前端模板中实现双标题的导航样式。
- 导航描述： 这是一个可选字段，可以为导航链接提供简短的说明或提示信息，通常用于在鼠标悬停时显示工具提示或更详细的介绍。
- 链接类型： AnQiCMS提供了三种灵活的链接类型：
- 内置链接： 这种类型允许您轻松链接到网站的固定内置页面，如“首页链接”以及“文章模型首页”、“产品模型首页”等自定义内容模型的首页。
- 分类页面链接： 您可以直接选择网站中已创建的任何内容分类或独立单页面作为导航链接。这极大地简化了将网站内容集成到导航中的过程。
- 外部链接： 如果您需要链接到站外资源或自定义的站内URL，可以选择此类型，并填写完整的URL地址。
- 显示顺序： 通过输入数字来控制导航链接的排列顺序。数字越小，链接在菜单中显示的位置越靠前。目前AnQiCMS采用数值排序，未来可能会支持拖拽排序以提供更直观的操作体验。
在网站模板中调用导航
配置好后台导航后，关键一步是在网站的前端模板中正确地调用和显示这些导航。AnQiCMS提供了功能强大的navList模板标签来实现这一目标。
您通常会在网站的通用头部（header）或底部（footer）模板文件（例如 /template/您的模板目录/partial/header.html 或 /template/您的模板目录/bash.html）中使用navList标签。使用时，您需要指定typeId参数来调用特定的导航类别。typeId的值对应于您在后台“导航类别管理”中创建的每个类别的ID。如果未指定，默认将调用typeId=1（即“默认导航”）。
以下是一个在模板中调用两级导航的示例：
{% navList navs with typeId=1 %} {# 假设1是您的顶部导航类别ID #}
<ul>
{%- for item in navs %} {# 循环遍历一级导航项 #}
<li class="{% if item.IsCurrent %}active{% endif %}">
<a href="{{ item.Link }}">{{item.Title}}</a>
{%- if item.NavList %} {# 判断是否存在二级导航 #}
<dl> {# 二级导航通常用dl/dd或ul/li结构 #}
{%- for inner in item.NavList %} {# 循环遍历二级导航项 #}
<dd class="{% if inner.IsCurrent %}active{% endif %}">
<a href="{{ inner.Link }}">{{inner.Title}}</a>
</dd>
{% endfor %}
</dl>
{% endif %}
</li>
{% endfor %}
</ul>
{% endnavList %}
此代码片段将首先调用ID为1的导航类别下的所有一级导航链接。然后，对于每一个一级导航链接，它会检查是否存在子导航（item.NavList），如果存在，则进一步循环显示二级导航链接。通过CSS样式，您可以将这些结构渲染成美观的下拉菜单、顶部分类菜单或页脚链接组。
AnQiCMS的模板机制还支持include和extends等辅助标签，您可以将复杂的导航结构拆分成更小的可重用模板片段，再通过include标签将其引入主模板，从而保持模板代码的整洁和易维护性。
优化导航显示与用户体验
高质量的网站导航不仅能帮助用户快速找到所需信息，还能有效引导搜索引擎爬虫抓取网站内容，提升SEO效果。AnQiCMS的导航管理功能支持多模板切换，包括自适应、代码适配和PC+手机独立站点模式，这意味着您可以根据不同的设备和显示需求，为导航设计不同的布局和样式，确保在任何设备上都能提供**的用户体验。通过合理规划和细致配置导航，您可以显著提高网站的可用性和内容的可发现性。
总结而言，AnQiCMS提供了一套直观而强大的导航创建和管理工具。从定义不同的导航类别，到精细配置每个导航链接的显示名称、链接类型及顺序，再到灵活的模板调用机制，每一步都旨在帮助网站运营人员高效地构建出既美观又实用的网站导航系统，从而提升用户满意度和网站整体表现。
常见问题 (FAQ)
AnQiCMS是否支持创建多于两级的导航菜单？
目前AnQiCMS的后台导航链接设置支持最多两级导航（即一级主菜单和其下的二级子菜单）。如果您需要更深层次的导航结构，可能需要通过自定义模板和结合其他内容列表标签（如categoryList）在二级菜单项内部动态生成更多内容链接，但这将需要更复杂的模板逻辑来实现视觉上的三级或多级效果。
我能否通过拖拽方式调整导航链接的顺序？
当前版本的AnQiCMS导航链接的显示顺序是通过数字值来控制的。数字越小，排序越靠前。您需要在