Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

I'm trying to assign a different ID to each sub-menu wordpress generates using the wp_nav_menu function. As it is, wordpress assigns the same class (sub-menu) to every sub menu generated.

<ul class="sub-menu"></ul>

I'd like to have it generate something like:

<ul class="sub-menu" id="xx"></ul>

I have a custom walker in my theme function file in order to modify the output, but I have no idea how to get, say the ID of the parent menu item and assign it to the UL output.

Any help is appreciated!

edit Walker's below:

/**Custom walker**/
class description_walker extends Walker {
var $tree_type = array( 'post_type', 'taxonomy', 'custom' );
var $db_fields = array( 'parent' => 'menu_item_parent', 'id' => 'db_id' );
function start_lvl(&$output, $depth) {
    $indent = str_repeat("\t", $depth);
    $output .= "\n$indent<ul class=\"sub-menu\" id=\"wut\">\n";
}
function end_lvl(&$output, $depth) {
    $indent = str_repeat("\t", $depth);
    $output .= "$indent</ul>\n";
}
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;
    $classes[] = 'menu-item-' . $item->ID;

    $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) );
    $class_names = ' class="' . esc_attr( $class_names ) . '"';

    $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args );
    $id = strlen( $id ) ? ' id="' . esc_attr( $id ) . '"' : '';

    $output .= $indent . '<li' . $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;
    $item_output .= '</a>';
    $item_output .= $args->after;

    $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args );
}

function end_el(&$output, $item, $depth) {
    $output .= "</li>\n";
}
}
share|improve this question
    
Paste your walker in here. –  kaiser Jan 17 '12 at 18:14
    
The walker is pretty much the same as the default one: –  Jay Jan 17 '12 at 18:27
    
And you want every reader or possible answerer to go to core and check how the default walker looks like? –  kaiser Jan 17 '12 at 18:28
    
no, I ran out of characters via comments..edited my original post. –  Jay Jan 17 '12 at 18:30
    
Was meant that way :) –  kaiser Jan 17 '12 at 18:44
add comment

1 Answer

up vote 0 down vote accepted

Ended up using the following

 <script>
$(function(){
    var i =0;
 $('ul.sub-menu').addClass (function(idx) {

     return "item-" + idx;
 });
 });
 </script>

It adds a class of item-0, item-1, etc to each sub-menu it finds.

share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.