So today I started work on my first WordPress theme and so far it’s been a lot of fun. However, I have had difficulty in getting wp_nav_menu() to do what I want.
Here’s what I want:
<nav id="topnav" class="menu">
<ul>
<li class="current_page_item"><a href="#" title="Home">Home</a></li>
<li class="page_item page-item-2"><a href="#" title="About">About</a></li>
</ul>
</nav>
Looking in the documentation, I would expect the following call to do what I want:
<?php wp_nav_menu(array( 'container' => 'nav', 'container_id' => 'topnav' )); ?>
But instead I get this:
<div class="menu">
<ul>
<li class="current_page_item"><a href="#" title="Home">Home</a></li>
<li class="page_item page-item-2"><a href="#" title="About">About</a></li>
</ul>
</div>
To me it looks like my custom parameters are being ignored as the output from wp_nav_menu()
is exactly the same. Is there something I need to turn on somewhere to enable this or is there something else going on?
EDIT
Curiously, if I change menu_class
it alters the div’s class (I expected the div to be the container) but changing menu_id
does nothing.
EDIT 2
Even going into nav-menu-template.php and changing the defaults for container, container_id, container_class, menu_id does nothing. Changing menu_class to yyy will change the div’s class from menu to yyy.
i had the save problem: it’s because if you don’t create the menu in the admin wordpress use a fallback method and creates the menu out of all active pages … and if this happens than the options from wp_nav_menu are not used …
so: just create the menu in the admin and u can change the wrapper-tag to “nav”
First of all, you won’t be able to get WordPress to output any kind of
<nav>
element using native functions.<nav>
is an HTML5 tag, and WordPress is built to generate XHTML output … i.e. no<nav>
element.Edit: Apparently the function does allow
nav
… but keep in mind that the rest of the WordPress core is still built to output XHTML, not HTML5 … take care to make sure your site validates properly.Try removing that reference … it might be causing the error that’s ignoring your
'container_id' => 'topnav'
instruction. If things work right without the reference tonav
you should have this:The Menu API is partially broken, you can not rely on the output. There are diverse tickets in trac regarding that, I only did a quick search, but maybe a solution for your problem is explained in one of them:
not sure if anyone is still looking to solve this – but just got here trying to find the answer myself – thought I’d share my solution 🙂
Also wanted to use the <nav> instead of the <div> element and solved it by removing the <div>, as stated on this page, wordpress codex: http://codex.wordpress.org/Function_Reference/wp_nav_menu:
Added to my functions.php file, marked up the theme file with the <nav> tag & all worked fine for me 😉 hope this helps 🙂