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.

Is there a way I can wrap a div around wp_nav_menu's ul.sub-menu

So for example the markup would go from

<ul class="menu">

    <li><a href="/">Item 1</a></li>
    <li>
        <a href="/">Item 2</a>

        <ul class="sub-menu">

            <li><a href="/">Item 1</a></li>
            <li><a href="/">Item 1</a></li>

        </ul>
   </li>
    <li><a href="/">Item 1</a></li>
    <li><a href="/">Item 1</a></li>

</ul>

to this

<ul class="menu">

    <li><a href="/">Item 1</a></li>
    <li>
        <a href="/">Item 2</a>

        <div class="sub-menu-wrap">

            <ul class="sub-menu">

                <li><a href="/">Item 1</a></li>
                <li><a href="/">Item 1</a></li>

            </ul>

        </div>

   </li>

    <li><a href="/">Item 1</a></li>
    <li><a href="/">Item 1</a></li>

</ul>

Where "sub-menu-wrap" is the custom div.

Is this possible?

share|improve this question
add comment

1 Answer 1

up vote 4 down vote accepted

Use a custom walker, extend the methods start_lvl() and end_lvl.

Sample code, not tested:

class WPSE_78121_Sublevel_Walker extends Walker_Nav_Menu
{
    function start_lvl( &$output, $depth = 0, $args = array() ) {
        $indent = str_repeat("\t", $depth);
        $output .= "\n$indent<div class='sub-menu-wrap'><ul class='sub-menu'>\n";
    }
    function end_lvl( &$output, $depth = 0, $args = array() ) {
        $indent = str_repeat("\t", $depth);
        $output .= "$indent</ul></div>\n";
    }
}

Usage in your theme:

wp_nav_menu(
    array (
        'theme_location' => 'your-theme-location-EDIT-THIS',
        'walker'         => new WPSE_78121_Sublevel_Walker
    )
);
share|improve this answer
    
Perfect. Thanks a lot! –  Dean Elliott Jan 3 '13 at 20:16
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.