如何在 WordPress 中创建自定义菜单结构
已发表: 2015-07-22WordPress 有一个自动的内置导航结构,可以为您创建菜单。 它包括页面和类别。 它将它们放置在您的主菜单中,您无需执行任何操作,只需在类别中创建页面或帖子。 如果您只有几个页面和类别,这很有效,但过了一段时间它可能会开始失控。 此外,仅仅因为它可以自动处理您的导航并不意味着您应该允许它。
WordPress 将自动为您处理菜单,无需您的任何输入,但如果您真的想充分利用您的菜单结构,您可以创建自己的自定义菜单。 自定义菜单可让您完全控制导航结构,并使您的网站看起来更干净、更专业。
菜单类型
有几种不同类型的菜单。 您可以使用的菜单类型取决于主题的功能。 流行的菜单类型包括:
- 主菜单——这个出现在标题下方。 它应该包括您的主要导航和访问者根据您拥有的网站类型期望的页面:主页、关于、联系人、博客、投资组合等。
- 二级菜单——这个出现在标题上方。 这应该包括您希望在方便的位置提供给读者的链接和页面,但不一定在您的主要导航结构中。 这可以是教程、购物车等项目。
- 侧边栏 - 您的自定义菜单可以使用自定义菜单小部件放置在侧边栏中。 您可以使用任意数量的小部件并在其中放置任何菜单。
- 页脚——您可以为您的页脚创建一个菜单。 此菜单中的信息通常少于您的主菜单。 根据您网站的需要,它通常包含主页、关于、联系方式、博客等。如果您的网站包含招聘信息、附属计划和姊妹网站,它们也可以包含在此处。
- 社交链接菜单——这是一个特殊的菜单,可以在诸如二十五等主题中找到,将您的社交媒体链接放在您的侧边栏中。 如果主题识别社交网络,它将提供适当的图标。 如果不是,那么它会将名称显示为文本(根据您标记链接的方式)。
主菜单和辅助菜单是 WordPress 主题中最受欢迎的。 它们中的内容实际上取决于您网站的重点。 您网站的主要焦点应出现在主菜单中。 它应该对您的访问者有意义,并且是他们期望看到的。
例如,如果您有一家商店,那么您的购物车应该在主菜单中。 如果你有一个投资组合网站,但你也卖一些东西,那么你的投资组合应该在你的主菜单中,而购物车应该在二级菜单中。 只需考虑它在逻辑上适合的位置并相应地放置它。
创建您自己的自定义菜单
WordPress 让您可以轻松地手动创建自己的自定义菜单。 您可以从后端创建、调整和应用菜单,也可以从前端选择菜单以查看它们并在上线之前对其进行测试。
从后端创建菜单
在后端,转到外观并选择菜单。 在前端转到自定义并选择导航。
在菜单屏幕上选择创建新菜单,为菜单命名,然后单击创建菜单按钮。
现在您已准备好开始添加导航结构。 在左侧,您有页面、自定义链接和类别的框。 您可以将所有这些用作自定义菜单中的链接。 在中间你有一些选择。 您可以允许将所有新页面自动添加到菜单结构中,或者如果您想拥有更多控制权并自己选择页面和类别,请不要选中此项。
页面
如果左侧窗口中的页面选项卡尚未打开,请选择它。 要将页面添加到菜单,请选择所需的所有页面并单击添加到菜单。
如果您希望它们以不同的方式排列,只需将要移动的菜单项拖放到新位置即可。 您甚至可以通过将其拖放到您希望它成为子项的项目的右侧,使其成为另一个菜单项的子项。
您可以选择右侧的箭头打开项目并进行调整,例如更改名称和位置。 您还可以在此处从菜单结构中删除该项目。
自定义链接
要添加自定义链接,请在左侧窗口中打开自定义链接,添加所需的 URL,然后选择添加到菜单。 您可以创建任何类型的链接,并将它们作为菜单结构的一部分。 这也是您为“社交链接”菜单创建链接的方式。
然后,您可以将其拖放到菜单结构中所需的位置。
类别
您选择和添加类别的方式与在左侧窗口中选择和添加页面的方式相同。 它们的行为方式与菜单中的页面和链接相同。
保存您的菜单
一旦你喜欢你的新菜单结构,保存它,然后你就可以使用它了。
管理位置
有两种方法可以从后端使用您的菜单。
菜单设置
在您创建菜单的屏幕上,菜单设置下有一组复选框。 您可以选择任何菜单,然后选择要使用的位置。 您可以根据需要选择任意数量。 不要忘记保存它。
管理位置

选择管理位置选项卡。 在这里,您可以在下拉框中选择要使用的菜单。 您不必全部使用它们。 您已经选择了将在点击保存的地方使用哪些菜单,并且您刚刚更新了菜单结构。
小部件
WordPress 还有一个自定义菜单小部件,您可以将其拖放到侧边栏中。 从这里您可以选择您的菜单。
测试
这是我的测试菜单和侧边栏小部件。 接下来要做的是测试每个项目,以确保其运行顺畅且直观。 不要忘记这一步。 测试您的菜单以查看它是否按您的预期工作非常重要。 显然,这些不是您应该在您的网站上使用的菜单标题。
使用前端实现所见即所得的视图
要从前端修改菜单结构,请转到外观并选择自定义。 到达前端后,选择导航。 从这里您可以选择您的菜单。 此视图的优点是您可以在保存更改之前立即查看更改。 这样你就可以在提交之前决定你是否喜欢它。 不幸的是,这个系统不会让你创建它们。
使用 Divi 等主题自定义外观
一些主题,例如优雅主题的 Divi 2.4,为您提供工具,以便您可以从前端调整菜单的外观和感觉并立即查看它们的影响。 这样,您将在保存之前知道访问者会看到什么。
这是Divi的菜单调整。 您可以进行相同的调整来更改每个菜单项的外观。
进一步定制——使用插件来修改你的菜单
有许多可用于 WordPress 的插件,可帮助您使用新特性、外观和功能修改自定义菜单。 他们添加了大量的 CSS 调整,使它们具有响应性,甚至使它们更快。 以下是一些比较流行的插件。
自定义菜单向导小部件
这个免费插件添加了一个自定义菜单小部件,您可以使用简码在侧边栏或内容中使用该小部件。 它使您可以完全控制菜单参数,并允许您使用自定义菜单的特定部分。 它还添加了一些自定义类。
您可以显示菜单的特定部分或整个菜单。 您还可以使输出成为有条件的。 它将根据您指定的级别数显示为平面或分层。 您还可以使用 HTML 修改输出。
小部件的设置易于使用。 您从下拉框中选择菜单并选择过滤器、回退、输出、容器、类、链接和替代(这是另一个级别的条件)。 它还为您提供了一个简码,因此您可以将菜单粘贴到您的内容中。
Nextend 手风琴菜单
该插件可让您创建手风琴式菜单,完全控制菜单级别、颜色、动画等,每个菜单都有自己的设置和皮肤。 您可以控制字体、背景、颜色、图像等的级别和状态。它通过使用缓存加速菜单系统,提供各种类型的动画,无限级别的菜单,并提供 30 种设置。
我喜欢手风琴菜单的工作方式。 您可以在想要使用它们时展开它们,然后在您不想在屏幕上看到它们时隐藏它们以提供更清晰的布局。 该插件易于使用和设置。 您可以像自定义内容类型一样创建菜单。 然后,您可以将小部件拖到侧边栏中,并从小部件中选择菜单。
还有一个专业版,增加了三个主题和支持。 价格从 29 美元起。
响应式菜单
这个免费插件有 70 个选项来调整菜单的外观、感觉和行为。 您可以调整标题、CSS、动作、大小、动画、脚本等等。 它适用于移动设备,并且具有从一侧拉菜单并设置菜单位置的功能。 它甚至会缩小菜单的 CSS 和 JavaScript。 您还可以添加自定义 HTML 并导入/导出您的设置。
设置中有很多调整,但它们都很容易理解和调整。 还有高级设置,但您可以根据需要忽略它们。 它包括简码,如果您愿意,您甚至可以将 PHP 代码添加到您的主题中。
其他用于修改菜单的插件
这是我发现有趣的其他插件的列表。 它们添加或修改菜单的功能,并让您以各种方式控制它们。
- WordPress 超级菜单
- CSS3 超级下拉菜单
- WP 响应式菜单
- 字体真棒 4 菜单
- 菜单中的简码
- 更快的外观 - 菜单
- 食物和饮料菜单
- 简单的零售菜单
- 净化 WordPress 菜单
- 小部件菜单器
创建出色菜单结构的技巧
- 使用您的菜单来保持您的导航结构井井有条。
- 使用尽可能少的级别。 考虑初级和次级。
- 使用对读者有意义的名称,而无需他们破译您的代码。
- 使用 KISS 方法。 记住——越简单越好。 菜单应该易于使用和直观。
- 检查您喜欢的网站的菜单结构,看看您喜欢什么,不喜欢什么。 然后让你的更好。
最后的想法
添加您自己的自定义菜单结构很容易,这将使您的 WordPress 网站的外观和感觉更加专业,并使您的结构看起来不随机。 只需几分钟即可创建您自己的菜单集,您可以在上线前查看并试用它们。 您的访问者会喜欢一种菜单结构,它可以让他们更快速、更直观地浏览您的网站。
到你了! 您是否创建了自己的自定义菜单结构? 你有什么要补充的吗? 您是否使用插件来修改菜单? 在下面的评论中告诉我们。