WordPress自定义步行者:当前菜单项

mlmc2os5  于 2022-12-03  发布在  WordPress
关注(0)|答案(2)|浏览(136)

我是wordpress的新手,正在尝试建立一个自制的菜单结构。我找到了一个定制的步行者,并根据我的需要定制了它。菜单工作正常,现在你可以在my site上看到。
它通过<?php wp_nav_menu(array('walker' => new Custom_Nav_Walker())); ?>加载到header.php中。该命令嵌套在ul标记中,因此步行者只在其中生成li标记。
现在我想添加一个名为active的类到当前的父菜单项和它的下拉子菜单项中。我在网上搜索了几个小时,但没有找到任何我能理解的东西...
_
有人能帮我在我的自定义步行者中实现这个类吗?
提前感谢!
亚罗

class Custom_Nav_Walker extends Walker_Nav_Menu {
  function start_lvl(&$output, $depth = 0, $args = array()) {
      $output .= "";
  }

  function end_lvl(&$output, $depth = 0, $args = array()) {
    $output .= "";
  }

  function start_el(&$output, $item, $depth = 0, $args = array(), $id = 0) {

    parent::start_el($item_html, $item, $depth, $args);

    if ($item->is_dropdown && ($depth === 0)) {
      $output .= "";

    } elseif ($depth === 0) {
      $output .= "<li class=\"navbar-list-item\"><div class=\"w-dropdown\" data-ix=\"dropdown\"><div class=\"w-dropdown-toggle navbar-link\"><h5>".esc_attr($item->title)."</h5></div><nav class=\"w-dropdown-list dropdown-list\">";

    } elseif ($depth > 0) {
      $output .= "<a class=\"w-dropdown-link dropdown-link\" href=\"".esc_attr($item->url)."\">".esc_attr($item->title)."";
    }
  }

  function end_el(&$output, $item, $depth=0, $args=array()) {  

        if ($item->is_dropdown && ($depth === 0)) {
      $output .= "";

    } elseif ($depth === 0) {
$output .= "</nav></div></li>";

    } elseif ($depth > 0) {
    $output .= "</a>";
    }
  }  
}
j9per5c4

j9per5c41#

我写了一个新的自定义步行者。这一个现在工作。也许有人最终会有同样的问题。所以这里是解决方案:

class Custom_Nav_Walker extends Walker_Nav_Menu {
  function start_lvl(&$output, $depth = 0, $args = array()) {
      $output .= "";
  }

  function end_lvl(&$output, $depth = 0, $args = array()) {
    $output .= "";
  }

  function start_el(&$output, $item, $depth = 0, $args = array(), $id = 0) {

      $class_names = $value = '';

        $classes = empty( $item->classes ) ? array() : (array) $item->classes;
        $classes[] = 'menu-item-' . $item->ID;

        $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) );




    parent::start_el($item_html, $item, $depth, $args);

    if ($item->is_dropdown && ($depth === 0)) {
      $output .= "";

    } elseif ($depth === 0) {
      $output .= "<li class=\"navbar-list-item\"><div class=\"w-dropdown\" data-ix=\"dropdown\"><div class=\"w-dropdown-toggle navbar-link ".esc_attr($class_names)."\"><h5>".esc_attr($item->title)."</h5></div><nav class=\"w-dropdown-list dropdown-list\">";

    } elseif ($depth > 0) {
      $output .= "<a class=\"w-dropdown-link dropdown-link ".esc_attr($class_names)."\" href=\"".esc_attr($item->url)."\">".esc_attr($item->title)."";
    }
  }

  function end_el(&$output, $item, $depth=0, $args=array()) {  

        if ($item->is_dropdown && ($depth === 0)) {
      $output .= "";

    } elseif ($depth === 0) {
$output .= "</nav></div></li>";

    } elseif ($depth > 0) {
    $output .= "</a>";
    }
  }  
}
f4t66c6m

f4t66c6m2#

在函数start_el(&$output, $item, $depth = 0, $args = [], $id = 0)中,你可以得到$item->current的值,然后你可以简单地编写如下代码:

$current = '';
        if ($item->current) {
            $current = 'menu-underline';
        }

        $output .= '<a href="' . $item->url . '" class="nav-link ' . $current . '" type="button">';

相关问题