在 WordPress 上安装 Navi+ 大约需要 15–30 分钟。以下是完整流程——从下载插件到第一个菜单正式上线。
准备工作
- 一个 WordPress 或 WooCommerce 网站（自托管、WordPress.com 商业计划，或任何 WP 主机）
- 对 WordPress 站点的管理员访问权限
- 一个免费的 Navi+ 账户（在 dash.naviplus.app 创建）
第一步——安装插件
方式 A：通过 WordPress.org
- 在 WP Admin 中前往 插件 → 安装插件
- 搜索”Navi+ Menu Builder”
- 点击立即安装，然后激活
方式 B：手动上传
- 从 naviplus.io 下载插件 .zip 文件
- 在 WP Admin 中前往 插件 → 安装插件 → 上传插件
- 上传 .zip 文件并激活
第二步——连接 Navi+ 账户
激活后，WP Admin 侧边栏将出现 Navi+ 菜单项。
- 点击 Navi+ → 设置
- 输入你的站点 ID 和 API 密钥（在 Navi+ 控制台的 设置 → WordPress 中找到）
- 点击连接
如果你还没有 Navi+ 账户，系统会提示你创建一个。免费版涵盖所有核心功能。
第三步——选择菜单类型
在 WP Admin 的 Navi+ → 菜单构建器 中创建你的第一个菜单：
- Tab Bar → 最适合以移动端用户为主的 WooCommerce 商店
- Mega Menu → 带分类和图片的多列桌面导航
- Slide Menu → 适合现代商店的汉堡/抽屉式导航
- FAB → 用于促销或联系方式快捷入口的浮动操作按钮
- Grid Menu → 适合分类繁多商店的视觉网格布局
大多数 WooCommerce 商店可同时部署移动端 Tab Bar 和桌面端 Mega Menu，通过 Navi+ 的 Smart Publish 规则实现分设备显示。
第四步——构建菜单（或使用 AI）
手动方式：
- 点击添加项目创建菜单条目
- 为每个项目设置标签、URL 和图标
- 按所需层级进行组织
- 设置设计选项（颜色、字体、间距）
AI 方式（WooCommerce 推荐）：
- 点击 AI 生成
- Navi+ 的 AI 读取你的 WooCommerce 商品分类和分类法
- 生成完整的菜单结构——你进行审阅和调整
- 确认后进入样式设计
第五步——设置发布规则
在 Smart Publish 下：
- 设备：设置菜单在移动端、桌面端或两者上显示
- URL：配置哪些页面显示哪个菜单（可选）
- 条件：已登录用户与访客（可选）
对于典型的 WooCommerce 设置，将 Tab Bar 设为”仅移动端”，将 Mega Menu 设为”仅桌面端”。
第六步——发布
点击发布。菜单立即生效——无需编辑主题文件，无需修改页面构建器，也不需要开发者介入。
兼容性
Navi+ 适用于：
| WordPress 主题 / 系统 | 兼容性 |
|---|---|
| WordPress.org（自托管） | ✓ |
| WooCommerce | ✓ |
| Elementor | ✓ |
| Divi | ✓ |
| Avada | ✓ |
| Astra / OceanWP / GeneratePress | ✓ |
| Sage (Roots) / Timber | ✓ |
| 自定义主题 | ✓（基于脚本） |
故障排查
菜单未显示？ 检查 Navi+ 脚本是否在正确页面加载。前往 设置 → 发布规则，验证 URL 条件设置。
与现有菜单冲突？ 如果你希望 Navi+ 替换主题的原生菜单，可以通过一小段 CSS 代码隐藏主题头部（Navi+ 支持团队可为你的具体主题提供相应代码）。
加载缓慢？ 检查 Navi+ 设置中是否启用了 CDN 选项。这可确保资源通过 Navi+ 全球 CDN 分发，而非从你的服务器加载。
总结
在 WordPress 上安装 Navi+ 只需 15–30 分钟，无需编写代码。通过 WooCommerce 数据进行 AI 菜单生成，是搭建组织良好、移动端优化导航的最快路径。
→ 查看完整对比： Navi+ vs Max Mega Menu