如何在 WordPress 中创建动态菜单
已发表: 2022-10-23WordPress 是一个内容管理系统 (CMS)，可让您从头开始创建网站或博客，或改进现有网站。 在本文中，我们将向您展示如何在 WordPress 中创建动态菜单。 动态菜单是根据您正在查看的页面而变化的菜单。 例如，如果您正在查看有关“WordPress 主题”的页面，菜单将显示指向有关 WordPress 主题的其他页面的链接。 如果您正在查看有关“WordPress 插件”的页面，该菜单将显示指向有关 WordPress 插件的其他页面的链接。 在 WordPress 中创建动态菜单很容易。 首先，您需要创建一个菜单。 其次，您需要向菜单中添加项目。 第三，您需要将菜单分配到一个位置。 第四，您需要将代码添加到您的 WordPress 主题中。 让我们从第一步开始：创建一个菜单。
在本系列的第 2 部分中，我们通过创建动态导航菜单更进一步。 您将学习如何使用 Pro 插件根据它们在块可见性中的位置构建条件菜单。 块主题用于创建基于块原则的模板部件。 本教程将引导您完成在“徒步旅行”页面上创建二级导航菜单所需的步骤。 就像单击站点编辑器来编辑网站标题一样简单。 使用 Block Visibility 插件中的 Location 控件，我们还可以限制二级菜单的位置。 在知识库中，选择位置选项，然后单击省略号图标以启用它。
我们现在可以通过使用位置控制将块的可见性限制在远足游览页面，这允许对可见性进行更多控制。 发布规则指示我们选择页面发布类型以及“远足”页面类型。 在生成的规则设置中，应遵循以下内容。 在我们演示站点的主页上，我们将能够访问一个全新的条件菜单。 本文的其余部分有待完成。 您可以通过使用各种规则和规则集来实现这一点。 对于这个演示，我们选择了一个简单的示例。
要创建新菜单，请转到外观。 如果要创建二级菜单，请单击“创建菜单”，如果要为特定位置创建自定义菜单，请单击“我的自定义菜单”，如果要为其他位置创建二级菜单，请单击“二级菜单”。 将一些项目添加到菜单后，将其保存（例如，菜单项1、菜单项 2 和菜单项 3）。
如何在 WordPress 自定义主题中创建动态菜单？
在 WordPress 中创建动态菜单的一种方法是使用 wp_nav_menu 函数。 此功能将允许您创建一个根据您的网站结构自动生成的菜单。 您还可以使用此功能创建特定于您的主题的自定义菜单。
按照这些步骤，您可以在 WordPress 中创建一个简单而动态的导航菜单。 主要步骤是使用 register_nav_menus() 函数注册导航菜单。 要运行它，您必须首先在您的子主题的functions.php 文件中注册它，然后使用'init' 挂钩。 在此示例中，我们将利用主标题菜单。 Nav Menu 插件在 WordPress.org 上可用，它允许您根据不同用户的角色为不同的用户分配不同的菜单。 我们也可以使用这个插件同时注册多个菜单。 在前面的步骤中，我们可以通过在 WP_nav_menu 函数调用中引用自定义 CSS 类来根据网站的设计设置导航菜单的样式。
如何在 WordPress 中创建动态标题菜单
要在 WordPress 中创建动态标题菜单，您首先需要创建自定义菜单。 为此，请转到 WordPress 管理面板中的菜单部分，然后单击创建新菜单链接。 输入菜单名称，然后单击创建菜单按钮。 接下来，您需要将项目添加到菜单中。 为此，请单击添加项目链接，然后选择要添加到菜单的页面或帖子。 添加所需的所有项目后，单击保存菜单按钮。 您的动态标题菜单现在可以使用了。
如果我们使用 WordPress 动态菜单页面方法创建一个动态菜单页面，将在本教程后面介绍，我们将能够更改它。 在主导航中，背景图像用于根据其 ID 更改菜单项的位置。 使用“span”标签将允许我们隐藏文本以便查看我们看到的背景图像。 我们将使用的代码是由 WordPress 动态生成的，使用一个名为 current_page_ancestor 的特殊类，所以它应该看起来像这样：没有别的说法。 如果我们想增加子页面的数量，只需增加或减少 depth=2 设置，使其显示无限数量的页面。 使用 CSS，如下图所示的当前页面链接现在可以非常简单地以粗体显示。 导航到具有突出显示部分的父页面。 突出显示父页面的子页面。
WordPress 动态添加菜单项
可以通过 WordPress 管理仪表板或向主题添加代码来将菜单项添加到 WordPress 菜单。 如果您想将菜单项添加到现有菜单，只需登录您的 WordPress 站点并导航到“外观 > 菜单”页面。 从那里，您可以通过从左侧选择它们并单击“添加到菜单”按钮来添加新的菜单项。 如果您想通过代码添加菜单项，您需要在主题的 functions.php 文件中添加几行代码。 您需要做的第一件事是创建一个将添加菜单项的新函数。 该函数可以任意命名，但我们将其命名为“my_custom_menu_items()”。 在这个函数中，你需要使用 WordPress “wp_nav_menu_items” 过滤钩子。 此挂钩允许您向现有菜单添加新项目。 函数内的代码如下所示： function my_custom_menu_items( $items, $args ) { // 使用 $items 返回 $items; } add_filter('wp_nav_menu_items', 'my_custom_menu_items', 10, 2); 上面的代码将添加一个新功能，可用于将项目添加到现有菜单。 该函数本身还没有做任何事情，但它提供了一个框架，您可以使用它来添加您自己的自定义菜单项。 要实际添加菜单项，您需要修改函数内的代码以满足您的需要。 例如，如果您想添加指向“关于”页面的链接，您可以使用以下代码： function my_custom_menu_items( $items, $args ) { $items .= 'About'; 返回$项目； } add_filter('wp_nav_menu_items', 'my_custom_menu_items', 10, 2); 上面的代码将在菜单中添加一个新链接，其中包含“关于”文本。 您可以通过在函数内添加额外的代码行来添加任意数量的菜单项。
WordPress 动态菜单插件
WordPress动态菜单插件是为您的网站导航添加一些趣味的好方法。 通过允许您创建根据访问者正在查看的内容而更改的菜单，您可以让他们保持参与并返回更多。
如何在 WordPress 中创建自定义菜单
为了在 WordPress 中创建自定义菜单，您需要导航到仪表板中的“外观”部分并选择“菜单”选项。 从那里，您可以创建一个新菜单并添加任何所需的页面、类别或自定义链接。 保存更改后，您可以通过“管理位置”选项卡将新创建的菜单分配到您网站上的位置。
Vegibit 让您了解如何创建 WordPress 主题。 菜单将位于站点名称和标语区域下方，但位于站点内容上方。 为了让菜单出现，我们必须首先在主题的functions.php文件中注册位置。 在 WordPress 仪表板中创建我们的自定义菜单。 现在有必要使用 WordPress 核心注册我们的新菜单。 有了这个功能，我们现在可以管理仪表板的位置。 我们希望它看起来好像直接来自 WordPress_nav_menu() 函数。
在下一步中，我们将链接到整个类别列表。 如果您将鼠标移到每个链接上，您也许可以实现悬停效果。 为了了解这将如何工作，我们创建了一个 style.css 文件。 我们想从列表中的每个元素中删除链接的下划线和项目符号，以及从每个元素中删除填充和边距。 在 WordPress 摘要中，您将找到创建自定义菜单的分步过程。 这是对如何在 WordPress 主题中使用自定义菜单的一个很好的解释。 由于一些 WordPress 功能，我们的任务变得更加容易。 将新菜单链接到 WordPress 后，就可以轻松地从该菜单中添加或删除我们想要的任何类型的内容。
在 WordPress 中创建自定义菜单
创建菜单后，转到外观。 您将能够在菜单页面上看到新菜单。 选择它后，您可以根据需要对其进行自定义。