1
votes

I am new to wordpress and trying to build a selfmade menu structure. I found a custom walker and customized it for my needs. The menu works fine, by now as you can see on my site.

It gets loaded inside the header.php via <?php wp_nav_menu(array('walker' => new Custom_Nav_Walker())); ?>. The command is nested inside an ul tag, so the walker only generates the li tags inside.

Now I want to add a class called active to the current parent menu item and it's dropdown child. I searched the web for hours but didn't find anything I can understand…

_

Can anyone help me implement that class into my custom walker?

Thanks in advance!

Jaro

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>";
    }
  }  
}
1

1 Answers

1
votes

I wrote a new custom walker. This one works now. Maybe somebody will eventually have the same problem sometime. So here is the solution:

    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>";
    }
  }  
}