如何在WordPress(简单方法)中创建一个可折叠的侧栏菜单

您是否要在WordPress中创建一个可折叠的侧栏菜单?

可折叠菜单可以为您的网站访问者提供一种简单的方法来访问大量链接,而不会对您的侧栏进行混乱.它非常适合大型网站,电子商务商业商店或任何具有更复杂布局的站点.

在本文中,我们将向您展示如何在WordPress中轻松创建一个可折叠的侧栏菜单.

什么是可折叠侧边栏菜单(以及何时使用一个)

最友好的菜单可以轻松访问访问者需要的所有链接.但是,这对具有大量页面的站点或更复杂的布局可能是棘手的.

思考一家大型电子商务商店,具有许多产品类别和子类别,如亚马逊.

在标准菜单中显示每种产品类别不是一个好主意.购物者可能需要滚动菜单以查找它们感兴趣的类别.

这是可折叠菜单进入的地方.这些菜单在亲子关系中组织他们的内容.如果访问者点击可折叠菜单中的父项,那么它将展开以显示所有父母内容.

Guardian News Outlet为其移动站点使用可收缩的菜单.

可折叠菜单有时称为可扩展菜单.这是因为当访客点击它们时,它们的不同部分会扩展.

默认情况下,可折叠菜单隐藏了访客的大量内容和复杂性.这比通过长期的类别和子类别列表滚动,这更为用户友好.

说,让我们来看看如何在WordPress网站上轻松创建一个可折叠的侧栏菜单.

如何在Wordpress

中创建一个可折叠的侧栏菜单

您可以使用Bellows手风琴菜单插件在WordPress中创建一个可折叠的侧边栏菜单.

Bellows手风琴菜单提供方便的短码,因此您可以在任何页面,帖子或小部件区域上放置可折叠菜单,包括您的侧栏.

首先,您需要安装并激活插件.如果您需要帮助,请查看我们的指南如何安装WordPress插件.

在激活后,转到WordPress仪表板中的外观»菜单页面.

要启动,请在"菜单名称"字段中键入菜单的名称.您的网站访问者不会看到名称,因为它仅供您自己的参考.然后,您可以单击"创建菜单"按钮.

下一个,您可以选择要添加到可折叠菜单的页面.默认情况下,WordPress仅显示您最近的页面.如果要查看所有网站页面的列表,请单击"查看"选项卡.

或者,您可以单击"选择全部".这将为可折叠菜单添加所有页面.

一旦您对选择感到满意,请单击"添加到菜单"按钮.您还可以选择帖子,博客类别或添加自定义链接.有关更多详细信息,请参阅我们的指南如何在WordPress中添加导航菜单.

将所有不同的网页添加到菜单后,您可以通过拖动它们来移动它们.这将更改这些页面在可折叠菜单中显示的顺序.

可折叠菜单是关于父子关系的.

当访问者点击可折叠菜单中的父项时,它将扩展以显示所有子内容.

要创建此关系,只需使用拖放来排列父级下面的所有子页面.

下一个,抓住每个孩子并向右拖动它.然后,您可以发布此页面.这将缩进该项目并将其转换为子页面.

别忘了完成后点击"保存更改"按钮.

现在我们想将此可折叠菜单添加到WordPress侧栏.为此,我们将使用Bellows手风琴自动创建的一些短码.

要抓住短码,转到外观»bellows菜单.如果尚未选择,请确保选择显示所有选项卡.

您现在可以单击短代码框,该框应突出显示所有代码.现在,使用命令+ C或CTRL + C键盘快捷方式复制此代码.

下一步正在将此短代码粘贴到小部件中,因此将返回外观»小部件.这将显示当前主题中的所有小型绑定区域.您看到的选项可能会有所不同,但大多数现代WordPress主题都具有侧边栏.

一旦找到了侧边栏区域,请单击.本节现在将扩展.

要添加块,请单击+图标并开始键入短代码.出现时,选择短码块.

现在,只需将可折叠的菜单粘贴到此块中.要发布菜单,您需要单击屏幕顶部的"更新"按钮.

现在,当您访问您的网站时,您应该看到一个新的可折叠边栏菜单.

Bellows手风琴插件使其超级易于自定义此默认菜单.例如,您可能会更改其颜色方案以更好地反映您的网站的品牌.

如果要调整默认菜单,只需转到外观»bellows 菜单在Wordpress仪表板中.

此菜单包含您需要自定义可折叠菜单所需的所有设置.有很多设置探索.但是,您可能想要开始进入主要配置»基本配置.

此处,您可以在几种不同的菜单颜色之间切换.您还可以选择访问者是否可以使用手风琴折叠设置展开多个子菜单.

要更改菜单的对齐和宽度,请单击"布局和位置"选项卡.

如果您希望实时预览变更,则可以在WordPress自定义程序中编辑可折叠的边栏菜单.要这样做,请转到外观»自定义.

在左侧栏中,选择波纹管.

此处,您将找到可折叠侧栏的许多不同的设置.这包括更改其宽度,对齐和侧边栏菜单的颜色.

我们希望这篇文章有助于您了解如何在WordPress中创建一个可折叠的边栏菜单.您也可以通过我们的指南,了解如何跟踪您的网站访问者以及最佳推送通知软件以增长您的流量.

如果您喜欢本文,请订阅我们的YouTube频道以获取WordPress视频教程.您还可以在推特和Facebook上找到我们.

1
订阅评论
提醒
0 评论
内联反馈
查看所有评论