WordPress建站

如何在 WordPress 中创建下拉菜单

发布时间:2024-06-15 11:29:23

本文作者:

最后更新时间为 2024年6月15日

导航功能不佳会损害设计精美的网站的可用性和可访问性。让用户能够轻松快速地访问他们所需的任何内容至关重要。

尤其是当您积累了许多页面和帖子时,精心设计的导航栏或菜单将使用户能够轻松探索您提供的所有内容。这个简单的功能还可以帮助您降低跳出率,让访客停留更长时间

在本文中,我们将介绍如何在 WordPress 中创建下拉导航菜单栏。让我们开始吧!

如何在 WordPress 中添加下拉菜单:分步指南

导航菜单有多种类型,您在访问不同网站时可能见过。让我们来看看一些最受欢迎的选项。

可以说最常见的类型是标题菜单:

不过,侧边栏菜单也非常突出:

您还会在移动网站上看到大量汉堡菜单,这是一种响应式下拉菜单,当点击汉堡图标时它会展开:

最后一个例子——也是我们将在本文后面创建的——是下拉导航菜单或导航栏。像汉堡菜单一样,这种样式节省了屏幕空间,因为大多数内容都被隐藏起来,直到需要时才显示出来:

请记住,某些主题不支持下拉菜单。因此,您要做的第一件事就是确认您的主题是否提供此选项。您通常可以通过查看主题的文档来找到答案。但是,如果您的默认主题功能有限,则可以创建自定义下拉导航菜单 html 或 css 代码。

在以下演示中,我们将向您展示如何使用 WordPress 的原生功能来构建菜单。此方法的优点是,即使您将来更改主题或向网站添加新插件,您创建的任何菜单项都会保留。

步骤 1:创建菜单项

首先,导航至WordPress 仪表板中的外观 > 菜单。那里可用的选项部分取决于您当前的主题。

单击“编辑菜单”选项卡,您可以在其中选择创建新菜单:

在菜单结构部分下的输入字段中输入名称,然后单击创建菜单

一旦您创建了至少一个菜单,您将会在“编辑菜单”旁边看到一个名为“管理位置”的新选项卡。

现在您可以开始向菜单添加项目。您可以添加页面、帖子和自定义 URL。例如,要添加页面,请在右侧的“页面”部分下选中要添加的内容旁边的复选框,然后选择“添加到菜单”:                                                         

同样的流程也适用于帖子。如果您想在菜单中添加链接,请展开“自定义链接”部分并输入 URL 以及一些自定义文本:

您可以通过展开“类别”部分采取类似的步骤将类别添加到主菜单。通过这种方式创建的任何菜单项都将打开一个页面,其中包含特定类别下的所有内容。

第 2 步:设置菜单结构

在这个阶段,你的菜单还没有组织好。所有内容将按照添加的顺序显示。目前还没有下拉功能。所以下一步是解决这两个问题。

为此,您只需将菜单项拖放到您想要的任何位置即可。您甚至可以通过这种方式创建子菜单项。例如,我们列出了三篇特定的博客文章,以便它们出现在更广泛的博客菜单项下:

完成菜单结构自定义并添加每个下拉项后,请务必保存更改。另请注意,根据您的主题,您可能需要将新菜单分配到某个位置。相关选项可在菜单设置部分下找到:

然后,您可以在前端查看您的网站,查看菜单的实际效果。所有子项都将显示为下拉菜单:

请记住,导航菜单应该使浏览您的网站更加容易。因此,您需要限制添加到菜单中的项目数量,以免菜单变得混乱或杂乱。

步骤 3:将 CSS 添加到菜单

您还可以使用 CSS 类为下拉菜单添加自定义样式。为此,请先单击仪表板顶部的“屏幕选项” :

选中标有CSS 类的复选框:

这将使您能够创建自定义 CSS 下拉菜单。它还将限制任何自定义样式到您特定类所应用的项目。

步骤 4:预览菜单

此时,您的菜单已准备就绪。不过,在完成之前,您可能需要在 WordPress Customizer 中检查一下。您可以切换不透明度、悬停、字体大小等,同时实时查看它们的效果。

单击“使用实时预览管理”进入实时编辑器:

您可以根据需要在此处进行进一步的更改,例如添加、删除或重新排序菜单项:

您不需要新的选项卡来预览您的更改,因为定制器会向您显示您网站的实时预览。

第 5 步:发布菜单

准备就绪后,只需单击一下即可使新的下拉菜单生效。只需选择“发布”按钮:

这将使菜单在您的网站上生效,并允许访问者开始使用它。

还值得注意的是,如果您创建了多个菜单并希望将它们放置在不同位置,那么您也可以使用定制器:

使用定制器,您可以将菜单分配到主题支持的所有不同位置。

WordPress 下拉菜单插件

当然,如果您更愿意使用插件来创建下拉菜单,则有几种可用选项。以下是一些适用于 WordPress 的最佳菜单插件,包括免费和付费插件:

  1. Max Mega Menu一个免费插件,为现有的菜单编辑器添加了大量选项。
  2. 英雄菜单:高度可定制的工具,注重响应能力。
  3. UberMenu一种让您最大程度地控制菜单样式和功能的解决方案。

这些工具中的任何一个都可以完成工作。因此,选择哪一个取决于个人喜好和您正在寻找的特定功能。

使用高效的下拉菜单优化您的 WordPress 网站

建立具有视觉吸引力和可访问性的网站非常重要。在这两个方面都有用的一个简单技巧是创建下拉导航菜单。此菜单选项既美观又易于使用,还可以为您节省一些屏幕空间。

2024年如何创建WordPress网站

小兽wordpress凭借多年的wordpress企业主题制作经验,坚持以“为用户而生的wordpress主题”为宗旨,累计为10万多家客户提供品质wordpress建站服务,得到了客户的一致好评。我们一直用心对待每一个客户,我们坚信:“善待客户,将会成为终身客户”。小兽wordpress能坚持多年,是因为我们一直诚信。我们明码标价(wordpress做网站需要多少钱),从不忽悠任何客户,我们的报价宗旨:“拒绝暴利,只保留合理的利润”。如果您有网站建设、网站改版、网站维护等方面的需求,请立即咨询右侧在线客服或拨打咨询热线:18907337671,我们会详细为你一一解答你心中的疑难。

相关文章

为什么选择小兽WordPress

哪怕不计成本的时间投入,也绝不辜负任何一个客户。
成就客户成就自我的同时,把这个世界变得再美好一点。

我们的故事

小兽WordPress是2011年开始接触互联网,在这期间用WordPress搭建了一个博客叫小兽WordPress,专门学习WordPress建站。

我们的使命

我们希望用WordPress这款优秀的建站程序帮助每个人搭建一个属于自己的网站,高效率低成本做好互联网营销。

我们的文化

我们专注于把客户的事情做好并且做对,这意味着我们在做决定时会考虑到结果,最重要的是,我们力求真实。

我们的未来

我们将在不久的未来成为国内最好的WordPress工作室,小兽WordPress希望和每一个客户成为朋友,一起见证这个美好未来。

为什么选择小兽WordPress

无论你是谁,我都为你量身定制建站方案

我们深知不同的人做网站的阶段不一样,有的是新手,有的是老手。
我们清楚不同的人做网站的目的不一样,有的是展示,有的是营销。

如何让线上业务更上一层楼

还没有WordPress网站

还没有WordPress网站

不管你从事什么行业,WordPress都会为你提供一个专业的主题模板。在WordPress市场上有成千上万的免费主题,适合很多中小企业。

查看所有模板
已经有WordPress网站

已经有WordPress网站

小兽WordPress诚邀你一起学习WordPress,愿与各方携手升级改善您的WordPress网站,一起交流网站加速,网站优化等问题。

马上交个朋友
微信联系
chat 扫码联系
模板建站
挑选模板
网站定制
免费诊断
咨询热线
咨询热线

189-0733-7671

返回顶部