如何在WordPress中为每个子菜单项包裹div标签

完全可以实现，核心是通过自定义Walker类修改菜单项的输出结构——你之前尝试Walker只处理了

，是因为没重写针对单个菜单项的方法。以下是具体步骤：

1. 在主题的functions.php中添加自定义Walker类 #

这个类继承默认的Walker_Nav_Menu，重写处理菜单项开头和结尾的方法，仅针对子菜单（层级深度>0）的

• 添加包裹
  ：

  class Custom_Submenu_Walker extends Walker_Nav_Menu {
      // 处理菜单项的开始标签
      function start_el(&$output, $item, $depth = 0, $args = null, $id = 0) {
          // 仅对子菜单的项添加<div>开始标签
          if ($depth > 0) {
              $output .= '<div class="something">';
          }
          
          // 调用父类方法输出默认的<li>及内部内容
          parent::start_el($output, $item, $depth, $args, $id);
      }
  
      // 处理菜单项的结束标签
      function end_el(&$output, $item, $depth = 0, $args = null) {
          // 先输出默认的</li>
          parent::end_el($output, $item, $depth, $args);
          
          // 仅对子菜单的项闭合<div>
          if ($depth > 0) {
              $output .= '</div>';
          }
      }
  }
  

  2. 调用菜单时指定使用这个自定义Walker #

  在你输出菜单的位置（通常是主题的header.php文件），修改wp_nav_menu的调用参数，添加walker选项：

  wp_nav_menu(array(
      'theme_location' => '你的菜单位置标识', // 替换为你主题中注册的菜单位置
      'walker' => new Custom_Submenu_Walker(),
      // 其他参数（如menu_class等）可根据需求保留或调整
  ));
  

  关键说明 #

  • $depth > 0的判断确保只有子菜单的
  • 会被
    包裹，主菜单的
  • 不受影响
  • 如果你的主题已经使用了自定义Walker类，需要改为继承那个主题自带的Walker，而非默认的Walker_Nav_Menu
  • 修改代码后记得刷新前端页面，若看不到变化可以清除浏览器缓存或WordPress缓存

  内容的提问来源于stack exchange，提问作者Zunayn