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.

How do I avoid ID conflicts if I use the same menu TWICE on one page.

FIRST

wp_nav_menu( array( 'sort_column' => 'menu_order', 
'theme_location'=>'menu', 'menu_class'=>'menu', 'menu_id'=>'menu' ) );

SECOND:

wp_nav_menu( array( 'sort_column' => 'menu_order', 
'theme_location'=>'menu', 'menu_class'=>'menu2', 'menu_id'=>'menu2' ) );

ID conflicts are like "Duplicate ID menu-item-2456"... Any solutions?

share|improve this question
    
You are not supposed to use the same theme_location, can you define a second one? –  Mario Peshev Jun 15 '12 at 18:25
    
This cannot happen with different 'theme_location's. I’ll remove my answer. –  toscho Jun 15 '12 at 18:54
add comment

1 Answer

up vote 2 down vote accepted

The solution is not to call the same 'theme_location' more than once. Theme location is intended to represent an explicit location within the template.

Just register a separate 'theme_location' for each separate location within the template that you want to display a nav menu.

Consider your chosen 'theme_location' names to be semantic names, representing the template location of the menu. You could use 'primary' and 'secondary', or 'header' and 'footer', etc.:

<?php
function wpse55380_setup_theme() {

    // Register nav menu locations
    register_nav_menus( array(
        'header' => 'Header Menu',
        'footer' => 'Footer Menu'
    ) );
}
add_action( 'after_setup_theme', 'wpse55380_setup_theme' ); 

...or:

<?php
function wpse55380_setup_theme() {

    // Register nav menu locations
    register_nav_menus( array(
        'primary'   => 'Primary Header Menu',
        'secondary' => 'Secondary Header Menu'
    ) );
}
add_action( 'after_setup_theme', 'wpse55380_setup_theme' ); 

Then, it is up to the end user to assign custom menus to each Theme Location.

share|improve this answer
    
Thank you :) Yes, this answers my question but what if I want to use "Header menu" as normal menu and exactly the same menu in compact version (e.g. it hides "Header menu" and shows "Compact Header menu" on blog to save space)? It's inconvenient to ask theme users to setup the same menu twice. Any suggestions? –  Paul Jun 15 '12 at 18:53
2  
For one: what is the actual difference between Header Menu and Compact Header Menu? Knowing the differences will help determine the best way to implement. For another: I actually disagree that it is poor form to ask the user to define two separate menus for two separate use cases. In fact, creating a responsive/mobile Theme may very well involve having the user define a full menu and a compact/abridged menu, to output depending on context. –  Chip Bennett Jun 15 '12 at 18:58
    
"Header Menu" is EXACTLY the same as "Compact Header Menu". First hides and second appears to make more space for content. Yes, it's responsive/mobile behavior to save space. I don't want to affect CSS style to achieve that. In this particular case it should be rather the same because it only appears when POPUP window with content appears. –  Paul Jun 15 '12 at 19:01
    
""Header Menu" is EXACTLY the same as "Compact Header Menu"." It' can't be; otherwise, why even have two separate menus? If they're not different with respect to CSS, then how are they different? –  Chip Bennett Jun 15 '12 at 19:26
    
Normal menu has height 150px and icons, second menu has height 30px, no icons, only text. First slides up off the screen and second slides down (to be visible) using jQuery. –  Paul Jun 15 '12 at 19:32
show 5 more comments

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.