如何将自定义 HTML 添加到 wp_nav_menu？

更新于 2022年1月11日 wordpress教程

我熟悉 WordPress 并使用 WordPress 菜单系统。 但我正在寻找一种将自定义 HTML 添加到wp_nav_menu() 。

我正在尝试创建一个这样的菜单：在此处输入图片说明

请注意产品下的下拉菜单如何包含图像和链接。 我想重新创建这个。 我看过一些插件，但宁愿编码。

我不介意硬编码图像和链接，但我想保持使用 WordPress 来管理菜单的灵活性。

解决方案

WordPress 通过菜单页面显示项目的方式是使用 walker 对象。 在这种情况下，此对象的特定类称为 Walker_Nav_Menu。 您可以在wp-includesnav-menu-template.php找到它。

Walker_Nav_Menu是一个非常简单的类。 您可以看到链接和菜单结构是如何在那里构建的。 函数start_el和end_el用于构建菜单项。 函数start_lvl和end_lvl用于嵌套菜单。 在这种方法中，我们将主要使用start_el和end_el 。

在您的functions.php创建一个类，使用与父类非常相似的方法来扩展Walker_Nav_Menu ：

class Custom_Walker_Nav_Menu extends Walker_Nav_Menu {
  function start_el ( &$output, $item, $depth = 0, $args = array(), $id = 0 ) {
    // Copy all the start_el code from source, and modify
  }

  function end_el( &$output, $item, $depth = 0, $args = array() ) {
    // Copy all the end_el code from source, and modify
  }
}

在这些函数中， $item是您的菜单项，如果您愿意，您可以使用它根据当前菜单项查询其他内容。 请注意，我没有包含start_lvl和end_lvl ，但这并不重要，因为您的类将自动继承父类方法，如果没有被覆盖。

然后，在您的主题文件中，您可以像这样调用 wp_nav_menu：

wp_nav_menu(array(
  'theme_location' => 'main',
  'container' => false,
  'menu_id' => 'nav',
  'depth' => 1,
  // This one is the important part:
  'walker' => new Custom_Walker_Nav_Menu
));

WordPress 将使用您自定义的类和函数，以便您可以修改输出的代码。

你可能还喜欢下面这些文章

WordPress怎么新建导航菜单WordPress怎么新建导航菜单

WordPress菜单设置在哪想要设置WordPress导航菜单，首先要找到它在哪里。菜单进入菜单设置界面，可以看到这里有2个区域，左侧是网站的内容，包括页面、文章、分类目录、自定义链接，右侧是具体的菜单设置界面，用来调整、编辑菜单创建新的W

WordPress怎么新建导航菜单WordPress怎么新建导航菜单

WordPress菜单设置在哪想要设置WordPress导航菜单，首先要找到它在哪里打开仪表盘，选择。菜单进入菜单设置界面，可以看到这里有2个区域，左侧是网站的内容，包括页面、文章、分类目录、自定义链接，右侧是具体的菜单设置界面，用来调整、编

WordPress自动内链插件wpkal，网站全自动增加锚链接必备插件WordPress自动内链插件wpkal，网站全自动增加锚链接必备插件

什么是内链内链，顾名思义就是在同一网站域名下的内容页面之间的互相链接（自己网站的内容链接到自己网站的内部页面，也称之为站内链接）。自动内链工作原理简单来说，我们设定一些词表以及词表对应的链接，比如词是wordpress插件，链接是http。

WordPress admin bar 添加自定义链接菜单WordPress admin bar 添加自定义链接菜单

bar中添加自定义链接菜单，您可以在主题的functions.php文件中添加代码。以下是一个示例代码，演示如何添加自定义链接菜单：在上述代码中，表示在admin。在这个示例中，我们添加了一个顶级菜单项，其ID为，标题为“自定义链接”，链接为

WordPress 仪表盘WordPress 仪表盘

WordPress仪表板是第一个屏幕，当您登录到您的博客的管理区域，将显示网站的概述将看到。Menu(仪表板菜单)WordPress仪表板提供了导航菜单，其中包含一些菜单选项，例如左侧的帖子，媒体库，页面，注释，外观选项，插件，用户，工具和设

WordPress文章编辑器页面右侧的分类展示使用的是什么函数？WordPress文章编辑器页面右侧的分类展示使用的是什么函数？

WordPress文章编辑器页面右侧的分类展示使用的是wp_terms_checklist()函数。该函数用于显示一个包含分类目录或标签的复选框菜单，允许用户在文章编辑页面中选择相关的分类或标签。

如何在wordpress中对the_content()和the_excerpt()设置字符限制如何在wordpress中对the_content()和the_excerpt()设置字符限制

例子：-用于使用函数（用于显示页面的主要内容）用于使用函数（用于显示页面的摘录短内容）用下面的代码替换php。只是为了帮助，如果有人想限制帖子长度..然后可以使用下面的代码来做到这一点..下面的代码只是对先生的修改我知道这篇文章有点旧，但我想

如何在 WordPress 中调用 ajax如何在 WordPress 中调用 ajax

这里，wp_ajax_nopriv。在用户未登录时调用，wp_ajax。这里在functions.php中add_actions：在上面添加这个函数，现在这个函数：这里在一些。