Appearance
导航管理
本文档介绍店铺装修的导航管理功能，用于配置小程序店铺底部导航栏的菜单项、图标和样式。
功能概述
导航管理功能允许用户配置小程序底部导航栏。整个流程包括：
- 配置模式选择 - 选择系统默认或自定义模式
- 菜单项配置 - 设置菜单名称、图标和跳转页面
- 样式配置 - 配置导航背景颜色和文字颜色
- 实时预览 - 预览配置效果
- 配置保存 - 将配置保存到系统中
导航管理操作流程
第一步：进入导航管理页面
在导航管理页面，可以配置小程序的底部导航栏。页面采用左右分栏布局：
- 左侧：手机预览区，实时显示导航栏效果
- 右侧：配置面板，进行各项配置
导航管理界面：
第二步：选择配置模式
系统提供两种配置模式：
系统默认模式
使用系统预设的导航配置：
- 全部商品 - 展示商品列表
- 店铺信息 - 展示店铺信息
系统默认配置不可修改，如需自定义请切换到"自定义"模式。
系统默认模式手机界面：
自定义模式
允许用户完全自定义导航栏配置，包括：
- 菜单项数量（2-5个）
- 菜单名称
- 菜单图标（选中/未选中状态）
- 跳转页面
- 导航背景颜色
- 文字颜色（选中/未选中）
自定义模式界面：
第三步：配置导航样式
在自定义模式下，可以配置导航栏的样式。
导航背景颜色
- 在配置面板找到 "导航背景" 配置项
- 点击颜色选择器，选择导航背景颜色
- 也可以手动输入颜色值（如：#ffffff）
- 点击重置按钮可恢复默认颜色（白色）
字体配色
- 在配置面板找到 "字体配色" 配置项
- 未选中字体颜色：设置未选中菜单项的文字颜色
- 选中字体颜色：设置选中菜单项的文字颜色
- 点击重置按钮可恢复默认颜色
默认颜色值：
- 未选中文字颜色：
#333333 - 选中文字颜色：
#31CFBE
第四步：配置菜单项
在自定义模式下，可以添加和配置菜单项。
添加菜单项
- 点击配置面板底部的 "添加菜单(最多5个)" 按钮
- 系统会自动添加一个新的菜单项
- 菜单项数量限制：最少2个，最多5个
配置菜单项信息
每个菜单项需要配置以下信息：
1. 菜单名称
- 点击菜单项中的名称输入框
- 输入菜单显示名称（最多4个字符）
- 系统会显示字符计数提示
2. 菜单图标
- 未选中图标：点击"上传图标"按钮，选择图标图片
- 选中图标：点击"上传图标"按钮，选择图标图片
- 支持更换已上传的图标
3. 跳转页面
- 点击 "修改" 按钮
- 在弹出的页面选择弹窗中选择要跳转的页面模板（改弹窗展示的页面模板是已保存好的装修模板）
选择页面弹窗：
删除菜单项
- 点击菜单项右上角的删除按钮
- 确认删除操作
- 注意：菜单项数量不能少于2个
第五步：预览配置效果
在左侧预览区可以实时查看配置效果：
- 查看导航栏：预览区底部显示配置的导航栏
- 切换菜单：点击预览区的菜单项，可以查看选中/未选中状态
- 实时更新：修改配置后，预览区会实时更新显示
第六步：保存配置
完成配置后，点击配置面板右上角的 "保存配置" 按钮。
菜单项配置规范
菜单数量限制
- 最少数量：2个菜单项
- 最多数量：5个菜单项
- 推荐数量：3-5个菜单项，符合用户使用习惯
菜单名称规范
- 字符限制：最多4个字符（中文或英文）
- 命名建议：简洁明了，易于理解
- 常见命名：首页、商品、分类、购物车、我的
跳转页面
- 页面来源：必须选择已创建的页面模板
- 选择方式：通过页面选择弹窗选择
- 页面说明：菜单会跳转到选中的页面模板
常见问题
1. 如何切换配置模式？
在配置面板右上角，点击 "系统默认" 或 "自定义" 按钮即可切换模式。切换到自定义模式时，系统会恢复之前保存的自定义配置。
2. 菜单项数量为什么不能少于2个，最多只能5个？
底部导航栏需要至少2个菜单项才能正常显示和切换。如果少于2个，导航栏功能将无法正常使用，考虑到移动端屏幕尺寸和用户体验，5个菜单项是合理的上限。过多的菜单项会导致每个菜单项显示空间过小，影响点击体验。
3. 如何选择跳转页面？
- 点击菜单项中的 "修改" 按钮
- 在弹出的页面选择弹窗中，浏览可用的页面模板
- 点击选择要跳转的页面模板
- 点击弹窗的 "确定" 按钮完成选择
注意：如果页面列表为空，请先在模板管理中创建页面模板。
总结
导航管理功能提供了灵活的底部导航栏配置能力，支持系统默认和自定义两种模式。使用者可自行配置小程序店铺底部导航栏的菜单项、图标和样式，控制页面跳转。