How To Customise wp_nav_menu [closed]

Question

I am developing a wordpress theme and I am trying to add a top menu below the title.

I am using the wp_nav_menu which displays the pages properly but I do not know how to style it.

Answer 1

The options are described in the codex. You could simply copy/paste the example code and add your own classes and IDs, like I do below:

<?php $defaults = array( 
 'container_class' => 'my-container-class', 
 'container_id'    => 'my-container-id',
 'menu_class'      => 'my-menu', 
 'menu_id'         => 'my-menu-id',
 'items_wrap'      => '<ul id="%1$s" class="%2$s">%3$s</ul>',
); ?>

<?php wp_nav_menu( $defaults ); ?>

The %1$s and similar are explained in the $items_wrap section. Essentially they are for choosing where you want these custom classes and IDs in the code. Once it's all set, open your style.css file and start the fun.

.my-container-class {
 /* set your rules here */
}

#my-container-id {
 /* and so on... */
}

The other, simpler option, only requires any code inspector and some basic knowledge of css. The IDs and classes generated by Wordpress would be enough to do the trick.

Answer 2

Here you can find the css classes of each individual element so you can set the styles on your CSS file:

http://codex.wordpress.org/Function_Reference/wp_nav_menu#Menu_Item_CSS_Classes