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.

Hi I'm wanting to create a custom navigation menu that will require creating div containers to hold the SUB-MENU set. In other words I want to do this:

  <ul class="left_menu">
     <li class="menu_item droped">
        <a class="top_link" href="#">Kurumsal</a>

     <div class="dropdown">
          <ul>
            <li><a href="#">Hakkımızda</a></li>
            <li><a href="#">Misyon Vizyon</a></li>
            <li><a href="#">Satın Alma</a></li>
            <li><a href="#">Kariye</a></li>
            <li><a href="#">Bayilik Başvurusu</a></li>

          </ul>
        </div>
      </li>

      <li class="menu_item droped">
        <a class="top_link" href="#/">Ürünlerimiz</a>

        <div class="dropdown">
          <ul>
            <li><a href="#">İnce Taneli Kumlar</a></li>
            <li><a href="#">İri Taneli Kumlar</a></li>
            <li><a href="#">Yalıtım Malzemeleri</a></li>
            <li class="last"><a href="#">Yapı Kimyasalları</a></li>
          </ul>
        </div>

      </li>
</ul>

How would I go about adding this into the wp_nav_menu function? Do I add a filter in functions.php, or do I create a separate PHP file to do this?

Any helpful suggestions would be greatly appreciated.

share|improve this question
add comment

1 Answer

up vote 1 down vote accepted

From what you described, it sounds like you might need to use a custom walker for the wp_nav_menu call. To create a custom walker that modifies the wrapper for dropdown lists, start with this class:

<?php

class wpse_112127_walker extends Walker_Nav_Menu {

    function start_lvl( &$output, $depth ) {
        $indent = str_repeat("\t", $depth);
        $output .= "\n" . $indent . '<div class="dropdown"><ul>' . "\n";
    }

    function end_lvl( &$output, $depth = 0, $args = array() ) {
        $indent = str_repeat("\t", $depth);
        $output .= "$indent</ul></div>\n";
    }
}

Then, use your walker in your wp_nav_menu call:

wp_nav_menu( array( 'walker' => new wpse_112127_walker ) );

This code should hopefully get you started on using a custom walker for your use case. Let me know if you have any difficulties/questions!

share|improve this answer
    
ok i did it, thanks for help. –  simandir Aug 29 '13 at 22:00
    
otherwise to add <a class="top_link" href="#"> i edited nav-menu-template.php $atts['xfn'] = ! empty( $item->xfn ) ? $item->xfn : ''; $atts['class'] = ! empty( $item->xfn ) ? $item->xfn : ''; –  simandir Aug 29 '13 at 22:09
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.