如何使用Conditional Menus插件让WordPress在不同页面显示不同菜单

发布时间:2021-09-24 15:01:43 作者:柒染
来源:亿速云 阅读:163

如何使用Conditional Menus插件让WordPress在不同页面显示不同菜单,针对这个问题,这篇文章详细介绍了相对应的分析和解答,希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。

菜单是每个网站的基本内容,它可以帮助访问者轻松找到他们需要的页面。但是,在结构复杂的网站上,您可能希望每组页面都有单独的菜单。要以这种方式自定义它们,您需要一个插件来创建不同的菜单并将它们分配给您的页面/页面组。

为每个页面创建单独菜单的情况

在以下情况下,为每个页面设置单独的菜单可能对您有所帮助:

为了更容易理解,我将以一个水果商业网站为例。我的网站在主页上有一个默认菜单,它指向两个页面:Apple 和 Banana。

如何使用Conditional Menus插件让WordPress在不同页面显示不同菜单

Conditional Menus 插件教程

我将使用Conditional Menus插件为这两个页面创建另外两个单独的菜单。以下是完成它的步骤:

第 1 步 :安装并激活 Conditional Menus 插件

Conditional Menus 插件是免费的,可在wordpress.org 上获得。您只需要像其他所有免费插件一样安装和激活它。

Conditional Menus 下载地址:https://litepress.cn/plugins/conditional-menus/

接下来,转到外观 > 菜单,切换到 管理位置,您可以看到插件添加的+ Conditional Menu:

如何使用Conditional Menus插件让WordPress在不同页面显示不同菜单

第 2 步:创建菜单

现在我将为 Apple 和 Banana 页面创建单独的菜单。为此,我转到外观 > 菜单 > 编辑菜单 > 创建新菜单。

如何使用Conditional Menus插件让WordPress在不同页面显示不同菜单

接下来,命名菜单,选择菜单的显示位置(我想显示在Header 上),然后单击创建菜单。

如何使用Conditional Menus插件让WordPress在不同页面显示不同菜单

在添加菜单项部分,您需要添加页面作为子菜单。我将在Apple Menu 中添加两个页面,分别是Apple Origin和Apple Price。单击“保存菜单”。

如何使用Conditional Menus插件让WordPress在不同页面显示不同菜单

我现在将执行相同的步骤为Banana页面创建一个单独的菜单:

如何使用Conditional Menus插件让WordPress在不同页面显示不同菜单

第 3 步:将菜单设置为相应的页面

仍然在外观 > 菜单,更改为管理位置并选择+ Conditional Menu:

如何使用Conditional Menus插件让WordPress在不同页面显示不同菜单

从列表中选择一个菜单(我选择的是Apple Menu)。单击+ 条件以设置显示位置:

如何使用Conditional Menus插件让WordPress在不同页面显示不同菜单

将出现一个新的弹出窗口,您将看到不同的选项卡可供选择。您可以选择在每个类别、文章类型、分类、用户角色、或主页、404页面等显示菜单。

我将选择Pages选项卡和Apple页面将菜单设置为此页面。

如何使用Conditional Menus插件让WordPress在不同页面显示不同菜单

我会对 Banana 菜单做同样的事情。

如何使用Conditional Menus插件让WordPress在不同页面显示不同菜单

最后,不要忘记点击保存更改,否则你所做的一切都会消失。

现在我将去WordPress的前端检查结果。

如何使用Conditional Menus插件让WordPress在不同页面显示不同菜单

如您所见,主页、Apple 页面和 Banana 页面现在具有我希望的三个不同的菜单。

总结

如您所见,使用 Conditional Menus 插件为不同的页面创建不同的菜单非常简单且有用。此外,该插件还为您提供了灵活的选择,可以为文章类型、类别、分类法、用户角色等甚至 404 页面创建单独的菜单。

关于如何使用Conditional Menus插件让WordPress在不同页面显示不同菜单问题的解答就分享到这里了,希望以上内容可以对大家有一定的帮助,如果你还有很多疑惑没有解开,可以关注亿速云行业资讯频道了解更多相关知识。

推荐阅读:
  1. 使用vue.js怎么实现一个二级菜单效果
  2. 使用vue-router实现动态权限控制的示例分析

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

wordpress

上一篇:如何在WordPress中创建自定义页面模板

下一篇:python中数据类型的示例分析

相关阅读

您好,登录后才能下订单哦!

密码登录
登录注册
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》