Wordpress 如何将自定义HTML添加到wp_导航_菜单?

Wordpress 如何将自定义HTML添加到wp_导航_菜单?,wordpress,Wordpress,我熟悉WordPress和使用WordPress菜单系统。但我正在寻找一种方法,将自定义HTML添加到wp\u nav\u menu() 我正在尝试创建如下菜单: 请注意“产品”下的下拉菜单如何包含图像和链接。我想重新创建这个。我已经看过一些插件,但更愿意编写代码 我不介意对图像和链接进行硬编码,但我希望保持使用WordPress管理菜单的灵活性。WordPress通过菜单页面显示项目的方式是使用walker对象。在这种情况下,该对象的特定类称为Walker_Nav_Menu。您可以在wp i

我熟悉WordPress和使用WordPress菜单系统。但我正在寻找一种方法,将自定义HTML添加到
wp\u nav\u menu()

我正在尝试创建如下菜单:

请注意“产品”下的下拉菜单如何包含图像和链接。我想重新创建这个。我已经看过一些插件,但更愿意编写代码


我不介意对图像和链接进行硬编码,但我希望保持使用WordPress管理菜单的灵活性。

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

Walker\u Nav\u菜单
是一个非常简单的类。您可以看到链接和菜单结构是如何构建的。功能
start_el
end_el
用于构建菜单项。函数
start\u lvl
end\u lvl
用于嵌套菜单。在这种方法中,我们将主要使用
start\u el
end\u el

functions.php
中创建一个类,用与父类非常相似的方法扩展
Walker\u Nav\u菜单

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\u lvl
end\u 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将使用您的自定义类和函数,以便您可以修改输出的代码。

谢谢Martin,今晚我将详细介绍一下。我想我在开始时加入了我的自定义HTML?是的。您还可以在开始时添加一个开始的html标记,并在结束时关闭它,但您可以保持简单;)将类放在functions.php的哪个部分重要吗?例如,有几个函数,包括那里的设置函数。有没有一种方法可以在特定li之间放置自定义代码?类现在被称为Class-walker-nav-menu.php,否则它就像一个符咒。虽然有很多行代码需要复制,但它很有效,而且很容易理解。谢谢。我知道了如何用比使用自定义walker少得多的代码来实现这一点:如何区分bweten顶级headin和其他heading?只想从顶级元素中删除标记。。。