当前位置:首页 > CMS教程 > 正文

WordPress菜单怎么用?

在WordPress后台,进入“外观”>“菜单”,创建新菜单,从左侧选择页面、文章、分类或自定义链接添加到菜单中,拖拽调整顺序和层级结构,最后在下方选择菜单显示位置(如主导航)并保存。

WordPress菜单使用完全指南

第一步:创建您的第一个菜单

  1. 登录WordPress后台
  2. 导航至 外观 > 菜单
  3. 在页面顶部找到 “创建新菜单” 区域
  4. 为您的菜单输入一个描述性名称 (“主导航”、“顶部菜单”、“页脚链接”),方便您后续管理
  5. 点击 “创建菜单” 按钮

第二步:向菜单添加内容
菜单创建后,您会看到几个添加内容的区域:

  1. 添加菜单项来源 (左侧面板):

    • 页面: 勾选您要添加的现有页面,点击 “添加到菜单”
    • 文章: 添加单篇文章链接
    • 自定义链接: 添加指向任何网址的链接(例如外部网站、特定锚点),输入 URL (网址) 和 链接文本 (显示名称),点击 “添加到菜单”
    • 分类目录: 添加博客分类、产品分类等的存档页面链接
    • 添加特定标签的存档页面链接
    • 其他 (取决于主题/插件): 您的主题或插件可能提供额外选项,如“首页”、“特定模板”等。
  2. 菜单结构 (右侧区域):

    您添加的所有项目会显示在这里,这就是您的菜单编辑区。

第三步:管理菜单结构

WordPress菜单怎么用?  第1张

  • 调整顺序: 在右侧的菜单结构区域,拖拽 菜单项上下移动即可改变它们在导航中的显示顺序。
  • 创建下拉菜单 (多级菜单):
    1. 将某个菜单项向右稍微拖动,使其位于另一个菜单项的下方并略微缩进。
    2. 松开鼠标,该菜单项即成为其上方菜单项的子项(形成下拉菜单)。
    3. 可以继续缩进创建更深层级(孙项)。
  • 编辑菜单项: 点击菜单项右侧的 小三角箭头 展开选项:
    • 导航标签: 修改菜单上显示的文字。
    • 标题属性: 鼠标悬停时显示的提示文本(可选,对SEO有细微影响)。
    • 链接关系(XFN): 高级选项,定义链接关系(如 nofollow,需谨慎使用)。
    • CSS类: 为该项添加自定义CSS类名,方便进行特殊样式设计。
    • 删除: 移除该项。
    • 自定义链接: 修改URL(对于自定义链接类型)。
  • 删除菜单项: 展开菜单项选项后点击 “删除”,或将其拖拽到左侧面板区域。

第四步:为菜单分配显示位置 (关键步骤!)
创建并组织好菜单后,必须告诉WordPress在哪里显示它:

  1. 在菜单编辑页面的底部或顶部,找到 “显示位置” 区域。
  2. 这里列出了您的当前主题支持的菜单位置(非常关键!常见位置有:主导航顶部菜单页脚菜单侧边栏菜单移动菜单等)。
  3. 勾选 您希望当前编辑的菜单显示在哪个位置(一个菜单可以分配到多个位置)。
  4. 如果您的主题有多个位置,请确保为每个位置都分配了正确的菜单。

第五步:保存您的菜单

  • 完成所有编辑和位置分配后,务必点击页面右上角或右下角的 “保存菜单” 蓝色按钮!否则所有更改将丢失。

第六步:管理多个菜单

  • 在菜单编辑页面的顶部,有一个 “选择要编辑的菜单” 下拉框。
  • 点击它可以选择您之前创建的其他菜单进行编辑。
  • 也可以点击旁边的 “创建新菜单” 按钮再建一个(例如页脚菜单、社交媒体链接菜单等)。

专业提示与常见问题解决:

  1. 菜单不显示? 这是最常见问题!

    • 检查位置分配: 回到菜单编辑器,确认您已勾选了正确的主题位置。
    • 检查主题设置: 有些主题有额外的选项控制菜单显示(在 外观 > 自定义 或主题专属设置面板中)。
    • 清除缓存: 如果使用了缓存插件或CDN,清除缓存后刷新页面查看。
  2. 如何添加图标? 通常需要:

    • 使用支持菜单图标的主题
    • 安装专门的菜单图标插件 (如 Menu Icons),在插件设置中为菜单项选择图标。
    • 使用 CSS 类 + 自定义CSS代码字体图标库 (需要一定技术知识)。
  3. 移动设备菜单: 大多数现代主题会自动将您创建的主菜单转换为移动友好的汉堡菜单,无需额外创建,但请务必在移动设备上测试效果。

  4. 菜单项数量限制: 通常没有硬性限制,但过多项目会影响用户体验(尤其在桌面导航栏),合理规划层级结构,利用下拉菜单组织内容。

  5. 自定义菜单样式: 如需改变颜色、字体、间距等:

    • 使用主题提供的 自定义选项 (在 外观 > 自定义 中常能找到)。
    • 外观 > 自定义 > 额外CSS 中添加自定义CSS代码 (需要CSS知识)。
    • 使用专业的 页面构建器插件 (如 Elementor Pro 的菜单小部件提供强大样式控制)。
  6. 高级功能 (插件扩展):

    • Mega Menus: 创建包含丰富内容(图片、多列链接、小部件等)的大型下拉面板,推荐插件:Max Mega Menu, Elementor Pro (带菜单小部件)。
    • 条件逻辑菜单: 根据用户角色、登录状态、页面类型等显示不同的菜单项,推荐插件:If Menu
    • 菜单图标: 如前所述,Menu Icons 是常用选择。

重要提示:

  • 保存是必须的! 任何修改后都要点击 “保存菜单”
  • 主题决定位置: 您的主题定义了可用的菜单位置(如“主导航”、“页脚”),不同主题位置名称和数量各异。
  • 响应式设计: WordPress核心和现代主题会自动处理菜单在手机、平板上的显示(通常折叠为汉堡菜单),选择优质主题是关键。
  • 插件安全: 安装插件时,请务必选择WordPress官方库中评级高、更新频繁的插件,以保障网站安全与稳定。

引用说明:
本文操作步骤基于WordPress核心的菜单管理功能,参考了WordPress官方文档关于菜单管理的说明,提及的插件功能描述来源于相应插件在WordPress.org插件目录中的官方介绍页面。

0