首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >如何向wp_nav_menu添加自定义超文本标记语言?

如何向wp_nav_menu添加自定义超文本标记语言?
EN

Stack Overflow用户
提问于 2012-09-03 23:46:59
回答 1查看 71.6K关注 0票数 20

我熟悉WordPress和使用WordPress菜单系统。但我正在寻找一种方法来添加自定义超文本标记语言到wp_nav_menu()

我正在尝试创建一个这样的菜单:

请注意products下的下拉菜单如何包含一个图像和一个链接。我想重新创建这个。我已经看过一些插件,但我更愿意对其进行编码。

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

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2012-09-04 00:08:19

WordPress通过菜单页面显示菜单项的方式是使用walker对象。在本例中,此对象的特定类称为Walker_Nav_Menu。您可以在wp-includes\nav-menu-template.php中找到它。

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

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

代码语言:javascript
复制
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_lvlend_lvl,但这并不重要,因为如果不重写,您的类将自动继承父类方法。

然后,在你的主题文件中,你可以像这样调用wp_nav_menu:

代码语言:javascript
复制
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将使用您的自定义类和函数,以便您可以修改输出的代码。

票数 60
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/12250866

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档