1

I'm trying to figure out if it's possible to attach an attribute to a wp nav menu item.
To demonstrate, this php:

<?php
    wp_nav_menu(array(
    'menu'  =>  'main',
    'container' => false
));
?>

would output a menu like so:

<ul id="menu-main" class="menu">
<li id="menu-item-01" class="menu-item">Menu 01</li>
<li id="menu-item-02" class="menu-item">Menu 02</li>
<li id="menu-item-03" class="menu-item">Menu 03</li>
<li id="menu-item-04" class="menu-item">Menu 04</li>
</ul>

but what I'd actually like is something like this:

<ul id="menu-main" class="menu">
<li id="menu-item-01" class="menu-item" data-hook="01">Menu 01</li>
<li id="menu-item-02" class="menu-item" data-hook="02">Menu 02</li>
<li id="menu-item-03" class="menu-item" data-hook="03">Menu 03</li>
<li id="menu-item-04" class="menu-item" data-hook="04">Menu 04</li>
</ul>

Is that at all possible to achieve? The attribute doesn't have to be data-hook I'm just using that as an example, just something I can use as an identifier.

0

1 Answer 1

3

You can use a Custom Walker to add attributes to the menu items.

Basically, you add a parameter 'walker' to the wp_nav_menu() options and call an instance of an enhanced class:

wp_nav_menu(
    array (
        'menu'            => 'main-menu',
        'container'       => FALSE,
        'container_id'    => FALSE,
        'menu_class'      => '',
        'menu_id'         => FALSE,
        'depth'           => 1,
        'walker'          => new Description_Walker
    )
);

The class Description_Walker extends Walker_Nav_Menu and changes the function start_el( &$output, $item, $depth, $args ).

  1. From the Codex:
    http://codex.wordpress.org/Function_Reference/wp_nav_menu#Using_a_Custom_Walker_Function

  2. I found this tutorial, you might find it very useful:
    http://www.kriesi.at/archives/improve-your-wordpress-navigation-menu-output

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