WordPress.org

1. 21cdb
   Member
   Posted 3 months ago #

   Hey i'm using this function to extend my wordpress menu

   //improve menu output and allow descriptions
   class My_Walker extends Walker_Nav_Menu
   {
   	function start_el(&$output, $item, $depth, $args) {
   		global $wp_query;
   		$indent = ( $depth ) ? str_repeat( "\t", $depth ) : '';
   
   		$class_names = $value = '';
   
   		$classes = empty( $item->classes ) ? array() : (array) $item->classes;
   
   		$class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item ) );
   		$class_names = ' class="' . esc_attr( $class_names ) . '"';
   
   		$output .= $indent . '<li id="menu-item-'. $item->ID . '"' . $value . $class_names .'>';
   
   		$attributes  = ! empty( $item->attr_title ) ? ' title="'  . esc_attr( $item->attr_title ) .'"' : '';
   		$attributes .= ! empty( $item->target )     ? ' target="' . esc_attr( $item->target     ) .'"' : '';
   		$attributes .= ! empty( $item->xfn )        ? ' rel="'    . esc_attr( $item->xfn        ) .'"' : '';
   		$attributes .= ! empty( $item->url )        ? ' href="'   . esc_attr( $item->url        ) .'"' : '';
   
   		$item_output = $args->before;
   		$item_output .= '<a'. $attributes .'>';
   		$item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after;
   		if (strlen($item->description)>2) {
         $item_output .= '<br /><span class="sub">' . $item->description . '</span></a>';
   } else {
        $item_output .= '</a>';
   }
   		$item_output .= $args->after;
   
   		$output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args );
   	}
   }
   
   //strip sanitizers from menu description
   remove_filter('nav_menu_description', 'strip_tags');

   It works very well but i'm missing some additional classes for the sub-menus (due to styling purpose.

   Is someone able to help me out in combining the function above with the following one:

   class UL_Class_Walker extends Walker_Nav_Menu {
     function start_lvl(&$output, $depth) {
       $indent = str_repeat("\t", $depth);
       $output .= "\n$indent<ul class=\"sub-menu level-".$depth."\"><span></span>\n";
     }
   }

   Thanks in advance!

2. maxxsnake
   Member
   Posted 3 months ago #

   Coincidentally, I'm also using the top code and needed to implement something at the sub-menu level. You can just add the second function into the first, then call the first walker. Mine looks like:

   class description_walker extends Walker_Nav_Menu
   {
         function start_el(&$output, $item, $depth, $args)
         {
              global $wp_query;
              $indent = ( $depth ) ? str_repeat( "\t", $depth ) : '';
   
              $class_names = $value = '';
   
              $classes = empty( $item->classes ) ? array() : (array) $item->classes;
   
              $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item ) );
              $class_names = ' class="'. esc_attr( $class_names ) . '"';
   
              $output .= $indent . '<li id="menu-item-'. $item->ID . '"' . $value . $class_names .'>';
   
              $attributes  = ! empty( $item->attr_title ) ? ' title="'  . esc_attr( $item->attr_title ) .'"' : '';
              $attributes .= ! empty( $item->target )     ? ' target="' . esc_attr( $item->target     ) .'"' : '';
              $attributes .= ! empty( $item->xfn )        ? ' rel="'    . esc_attr( $item->xfn        ) .'"' : '';
              $attributes .= ! empty( $item->url )        ? ' href="'   . esc_attr( $item->url        ) .'"' : '';
   
              $prepend = '<div class="top sans">';
              $append = '</div>';
              $description  = ! empty( $item->title ) ? '<div class="bottom">'.esc_attr( $item->attr_title ).'</div>' : '';
   
              if($depth != 0)
              {
                        $description = $append = $prepend = "";
              }
   
               $item_output = $args->before;
               $item_output .= '<a'. $attributes .'>';
               $item_output .= $args->link_before .$prepend.apply_filters( 'the_title', $item->title, $item->ID ).$append;
               $item_output .= $description.$args->link_after;
               $item_output .= '</a><div class="hidden"><div class="back"></div></div>';
               $item_output .= $args->after;
   
               $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args );
   		}
   
   		function start_lvl(&$output, $depth) {
   		    $indent = str_repeat("\t", $depth);
   		    $output .= "\n$indent<ul class=\"sub-menu level-".$depth."\"><span></span>\n";
   		}
   }

   Although I modified a few other things internally as needed and haven't finished modding the second part (thanks for that) yet, but it is exporting the markup into the sub-menu appropriately.

Reply

You must log in to post.