如何向您的 WordPress 主题添加下拉菜单

向您的 WordPress 主题添加下拉菜单可能是组织内容并使其更加用户友好的好方法。 有几种不同的方法可以为您的 WordPress 主题添加下拉菜单，在本文中，我们将向您展示如何使用WordPress 菜单系统来实现。

最近几周，导航菜单备受关注。 在开始编写高级菜单代码之前学习如何设计下拉菜单是个好主意。 它将为您提供在本教程中创建高级菜单所需的基础。 跟随本教程将需要： 第二步是学习 WordPress 菜单设计。 WordPress的内置菜单功能； 3. 这本书是为 WordPress 初学者编写的，涵盖了开发下拉菜单的基础知识。 如何使用 CSS 定位由 WordPress 菜单功能生成的 HTML。

在您的数据库中，您会在 wp_posts 表中找到导航菜单中每个项目的帖子。 每个帖子的元数据都是独一无二的，其中包括将显示的文本以及链接的目标。 确保在主题样式表中默认隐藏二级项目。 在这种情况下，顶部的元素不会被隐藏，因为它的一个嵌套元素将在顶部的另一个元素中。 您会注意到内容旁边有一个下拉菜单。 我们希望它看起来好像漂浮在材质之上。 因此，我们需要在样式表中包含布局样式来解决这个问题。

顶层项目的相对位置也必须在正文中列出。 为您的主题添加一个名为媒体查询的新类和一个名为 burger-menu.js 的新文件将允许它运行。 当用户点击图标时，可以使用脚本创建菜单。 在媒体查询中，我们将使用 CSS 隐藏菜单元素，该元素位于具有类的元素内部。

如何在 WordPress 页面中添加下拉菜单

要在 WP Admin 中创建下拉菜单，请转到外观。 菜单允许您通过拖放来更改项目的顺序。 要创建下拉菜单，请将一个项目向右拖动以将其“嵌套”在其正上方的另一个项目下； 通过再次向左拖动项目，您可以撤消此操作。

由于您网站上页面和帖子内容的增加，您可能难以在菜单栏中包含每个目的地。 在这个简短的提示中，我将介绍两种将 WordPress 菜单转换为下拉菜单的简单方法。 在添加下拉功能之前创建一个标准的 WordPress 菜单。 登录您的 WordPress 帐户并创建一个菜单。 拖放是将常规菜单变成下拉菜单的最佳方式。 下拉菜单也可以使用 WordPress 的实时预览和定制器创建。 例如，以下屏幕截图显示 Settings 是父级，Password Reset 和 Logout 是子级，并且两者都已注销。

如果您将菜单分为父母和孩子，您将在实时预览中看到您的更改。 选择“菜单位置”复选框之一，以确保您的新下拉菜单在该位置可见。 使用下拉菜单可以使您的网站更易于浏览，同时还可以减少菜单栏上的空间。

如何在 WordPress 的页面中添加菜单？

单击屏幕右上角的“查看全部”选项卡可查看您网站的所有页面。 接下来，通过单击要添加到菜单的每个页面旁边的框来选择“添加到菜单”选项。 添加页面后，您可以通过拖放来移动它们。

如何在 WordPress 中创建动态下拉菜单

在 WordPress 中添加动态下拉菜单相对容易，只需几个简单的步骤即可完成。 首先，创建一个父菜单项并在其下方添加任何所需的子菜单项。 接下来，转到外观 >菜单页面并从下拉菜单中选择新创建的菜单。 最后，选中“启用动态下拉菜单”旁边的框，然后单击“保存菜单”按钮。 而已！ 您的 WordPress 网站现在应该有一个动态下拉菜单。

WordPress 主题中下拉菜单的编码相对简单。 使用下面描述的两种方法，WordPress 可以为下拉菜单创建 HTML。 如果您不知道如何构建下拉菜单，下面的帖子将向您展示如何构建。 在早期版本的 Internet Explorer 的 Suckerfish 菜单中使用了一个非常小的 JavaScript 文件。 许多人将他们的 HTML 硬编码到他们的 header.php 文件中，但这并不是特别有效。 因为 WP_list_pages() 生成列表项，而不是 *ul> 标记，所以我对这些标记进行了硬编码，以将我们的 id 和链接包含到列表中。 因为您的主页通常不是 WordPress 页面，所以我在菜单中添加了一行代码，仅在标签中显示 index.php 页面。

WordPress 2.7 包含一个名为 WP_page_menu() 的新模板标签，它在一行中产生与上面基本相同的结果。 代码生成如下： code type=html 页面将根据页面名称命名，链接由链接来源描述。 当我们将 show_home 设置为 1 时，WordPress 应该在菜单中包含我们的主页。 尽管它经常用于编码drop downs ，但包装器 div 不是必需的。 可以使用类名参数设置类名。 无法将新的属性类添加到主页 current_page_item。 如果您正在寻找一种方法来设置当前页面的菜单项的样式，那么 WP_list_pages() 可能是一个更好的选择。

如何在 Woocommerce 中添加下拉菜单

在 WooCommerce 中，转到设置。 然后，在产品表下，选择您在许可证密钥后输入的默认设置。 必须包含列部分中的添加到购物车列，并且必须在“变体”下选择变体下拉菜单。

WooCommerce 店主的最终目标是为他或她的客户提供最佳的购物体验。 当任何人点击一个按钮或指向他们的文本时，下拉菜单会打开一个项目列表。 通过执行这些步骤，您将能够将下拉菜单添加到您的 WooCommerce 产品页面。 WooCommerce 中的额外产品选项（自定义插件）模块包括 16 个自定义字段，包括用于显示产品详细信息的下拉菜单。 您可以使用我们的自定义和默认产品字段作为您的利基来创建、编辑、删除和重新定位它们。 此插件也可以作为免费版本购买，如果您愿意，请立即试用。

没有页面的WordPress下拉菜单

有几种方法可以创建没有页面的 WordPress 下拉菜单。 一种方法是使用 Superfish 或 Dropdown Menu 之类的插件。 这些插件将允许您创建可以显示为下拉菜单的自定义菜单。 另一种方法是使用支持下拉菜单的主题。 一些主题，如默认的 WordPress 主题，将有一个内置的下拉菜单。

使用 PHP 这样的脚本语言，我可以轻松地在 WordPress 上创建一个下拉菜单。 这很简单； 只需按照我们的分步指南立即开始。 您不需要任何插件或编码知识即可很好地完成此操作，这太棒了。 执行作为管理仪表板一部分的四个步骤很简单。 当您选择显示 WordPress 下拉菜单的位置时，您可以选择它的显示顺序。 您可以通过转到管理位置或单击菜单结构链接来执行此操作。 有一个用于将顶级页面添加到此菜单的选项，称为自动添加页面。

如果您想实时查看正在执行的操作，可以通过从“工具”菜单中选择“使用实时预览管理”来实现。 如果您想要下拉式大型菜单，则应使用这些插件。 除了可扩展菜单和二维下拉菜单外，此应用程序默认显示所有项目。 使用免费版本，您可以添加水平巨型菜单、悬停或单击事件、支持弹出窗口以及使用多个菜单。 一个站点的 Pro 插件价格从 29 美元起，并根据项目的复杂程度而上涨。 您可以使用具有多种主题的 WP Mobile Menu 创建免费增值响应式移动菜单。 使用简单； 只需按照说明进行操作即可。

Hero Menu 插件售价 20 美元，提供六个月的支持。 不应使用包含太多或太少项目的下拉菜单。 如果它们太长，就会被认为是低于标准的，并且用户体验会受到影响。 选项少的下拉菜单如果选项少，就毫无意义。 您现在可以轻松创建自己的。

为目标空白菜单启用链接目标选项

要创建目标空白菜单，请执行以下步骤： br> 通过选择“高级菜单属性”下的“链接目标”，您可以通过首先启用“链接目标”选项访问“屏幕选项”屏幕。
如果要链接计算机，请转到“显示高级菜单属性”下的“链接目标”菜单。