如何在WordPress中创建下拉菜单(初学者指南)

06/22/2023

如何在WordPress中创建下拉菜单(初学者指南)

为什么在WordPress中使用下拉菜单?

WordPress配备了内置的菜单管理系统,允许您轻松地将导航菜单添加到您的网站。导航菜单是指向您网站最重要页面的链接,通常位于您网站徽标旁边的一行中。

如果您正在启动一个WordPress博客或创建一个只有少数页面的网站,创建一个单行菜单可能是合理的。访问者可以一目了然地看到所有重要页面。然而,如果您经营的是一个在线商店或大型网站,可能会有很多内容。将所有这些链接添加到菜单中可能会让人难以应付,使您的站点看起来杂乱无章。

下拉菜单解决了这个问题,当访问者将鼠标悬停在父项上时,这些菜单仅显示链接。它们还允许您按主题、类别或组来组织内容。您甚至可以为菜单添加标题。类似于垂直导航菜单,它们非常适合在小空间内展示大量内容。

步骤1:选择支持下拉菜单的主题

WordPress有一个内置的菜单管理系统,但菜单的外观会因您的WordPress主题而异。几乎所有的WordPress主题默认都支持下拉菜单。然而,有些主题可能没有恰当的下拉支持。首先,确保您的主题支持下拉菜单。

您可以从官方WordPress库下载该主题,然后访问其页面并点击“预览”按钮以查看实时演示。如果使用的是高级WordPress主题,开发者可能会在其网站上提供实时演示。您还可以查看该主题的文档获取更多信息。如果仍不确定,可以随时向开发者寻求帮助。

步骤2:在WordPress中创建导航菜单

让我们开始创建一个简单的菜单。如果您已经在网站上设置了导航菜单,则可以跳过此步骤。首先,前往WordPress仪表盘中的外观 » 菜单,然后点击“创建新菜单”链接。

接下来,您需要为导航菜单输入一个名称。这只是为了您的参考,您可以使用任何有助于在WordPress管理区域识别菜单的名称。输入标题后,点击“创建菜单”按钮。WordPress现在会为您创建一个空菜单。

步骤3:向菜单添加子项

接下来,我们需要添加将出现在下拉菜单中的子项。在左侧列中,选择要添加为子项的所有页面,然后点击“添加到菜单”按钮。这些页面现在会出现在右侧列的“菜单结构”下。

默认情况下,这些链接都显示为常规菜单项,这意味着它们将被添加到顶行。我们需要将它们变为父项的子项。只需拖动一个菜单项并将其放置在所需的父项下。然后稍微向右移动,它将成为子项。

步骤4:发布下拉菜单

如果您正在编辑一个已经在线的菜单,访问者将立即看到您的更改。如果创建的是新菜单,则需要为该菜单选择一个位置。每个WordPress主题都有自己的菜单位置,您可以在右侧的“菜单设置”部分中找到它们。勾选您希望使用的位置,然后点击“保存菜单”按钮。

使用全站编辑器创建下拉菜单

如果使用的是基于块的主题(如Hestia Pro),则可以使用全站编辑器将下拉菜单添加到网站的任何部分。要开始,请转到WordPress仪表盘中的主题 » 编辑。在默认情况下,全站编辑器将显示您的主题主页模板。要在网站的其他部分添加下拉菜单,请点击“模板”或“图案”。然后,编辑器将显示构成您的WordPress主题的所有模板或模板部分的列表。选择要添加下拉菜单的区域,然后点击小铅笔图标进行编辑。

创建互动的下拉菜单的提示

导航菜单很重要,因为它们是访问者寻找有趣内容或特定信息的首选地。正确使用它们将帮助访问者在您的网站上找到路,增加转换率和销售额,同时增加页面浏览量和降低跳出率。以下是创建有用且用户友好型下拉菜单的一些提示:

1. 创建多级下拉菜单

在本指南中,我们展示了如何创建顶行和一组子项。然而,您还可以在另一个子项下添加子项,创建多级下拉菜单。对于有大量内容或多种内容类别的网站,这可能会非常有用。

2. 创建多个下拉菜单

您可以创建任意数量的下拉菜单,然后在网站的不同区域展示它们。例如,您可能会创建一个仅显示产品类别的下拉菜单。这对于产品页面很有用,但您可能还想为主页创建一个独特的下拉菜单,让购物者可以找到网站的不同区域,如联系表单和博客。

3. 创建大型菜单作为下拉菜单

如果您有大量内容,可能会发现使用标准下拉菜单很难整齐地组织这些内容。相反,您可以展示网站的完整结构作为一个大型菜单,只有当用户将鼠标悬停在主菜单上时才会显示。大型菜单类似于下拉菜单,但它们可以显示更多链接、子菜单和其他项目。



Related Posts

  • 2024-08-04
  • WordPress 教学

不喜欢 WordPress 4.3 引入的格式化快捷键?觉得有点烦人?最近,有用户问我们如何在 WordPress 中禁用视觉编辑器格式化快捷键。在本文中,我们将向您展示如何做到这一点。

閱讀更多
  • 2024-07-31
  • WordPress 教学

你在 WordPress 网站上看到 503 服务不可用错误吗?503 错误是因为服务器无法处理请求,通常是由于服务器过载或维护。而这个错误不会告诉你具体原因,这对于初学者来说非常令人沮丧。本文将向你展示如何修复 WordPress 中的 503 服务不可用错误。

閱讀更多
  • 2024-07-30
  • WordPress 教学

管理一个企业需要大量的工作。如果您无法正确维护您的 WordPress 网站,可能会迅速看到流量和销售额下降的现象。幸运的是,您可以聘请虚拟助手 (VA) 来帮助管理您的网站。本文将教您如何聘请 WordPress 虚拟助手,以便您可以专注于业务中最重要的活动。

閱讀更多

{"email":"Email address invalid","url":"Website address invalid","required":"Required field missing"}
>