CODEWITHSUNDEEP
csswordpressmenunavigationthemes
Ben
Ben

Reputation: 83

Dropdown Menu in Wordpress

I am new to making WordPress themes but I have managed to include the navigation menu list in my theme. I want to turn it into a horizontal drop-down menu using CSS but I am having all kinds of trouble figuring it out.

I have used this code:

<?php wp_nav_menu( array( 'container_class' => 'menu-header', 'theme_location' => 'primary' ) ); ?>

To output this:

    <div id="nav-container">
<div class="menu">
<ul>
<li class="current_page_item">Current Page</li>
    <li class="page_item page-item-58">Menu Item #1
        <ul class='children'>
            <li class="page_item page-item-62">Child Item #1</li>
            <li class="page_item page-item-60">Child Item #2</li>
            </ul>
    </li>
</ul>
</div>

</div>

Can someone please tell me, or point me in the right direction for turning this into a drop down menu? As a note I do not know how to change the way the nav list is output either :(.

I know this might be a big ask but any help would be greatly appreciated!

Thanks Ben

Upvotes: 1

Views: 7235

Answers (2)

sulfureous
sulfureous

Reputation: 1526

Making dropdown menus in wordpress with their "menus" in the dashboard is extremely easy. You can simply make your menu and indent any of the items you would want inside a dropdown by simply dragging it a little bit to the right (it snaps into place) and wordpress by default will add the .dropdown class that you can then style with CSS however you want.

If you need help beyond that with the CSS then it's probably a good idea to learn how to make CSS dropdown menus so you can compliment it with this.

Cheers.

Upvotes: 1

markratledge
markratledge

Reputation: 17561

Lots of docs and examples available: http://codex.wordpress.org/Navigation_Menus and http://justintadlock.com/archives/2010/06/01/goodbye-headaches-hello-menus and http://codex.wordpress.org/Function_Reference/wp_nav_menu

Upvotes: 1

Related Questions