How to Add Second Navigation Menu to WordPress Child Theme (with Twenty Ten Parent)?

When making a child theme to Twenty Ten WP default theme sometimes we need a secondary navigation bar, often in the footer. TwentyTen theme has one primary navigation menu by default. You may create a custom menu for that primary nav, but what if we need a second customizable navigation menu, i.e. in the footer? I found how to add this secondary navigation to be available in excellent menu editor provided by WordPress 3 in its admin in Appearance panel. Easy enough to make.

To add a second nav bar to your child theme, we”ll need to modify 2 files. First add the menu to your child theme file. I did in my footer (as PHP code):

   // footer menu
   wp_nav_menu( array('container_class' => 'menu-footer', 
   'theme_location' => 'secondary' ) );

If you don’t have functions.php in your child theme yet, create functions.php file in your child theme folder and insert this code as PHP code block:

/*
adding footer menu, second nav to child theme
*/

function twentyten_setup() {
// This theme uses wp_nav_menu() in one location.
 register_nav_menus( array(
 'primary' => __( 'Primary Navigation', 'twentyten' ),
 'secondary' => __( 'Secondary Navigation', 'twentyten'),
 ) );
}

Menus page in WordPress Admin in Appearance Panel

Menus page in WP Admin

Now go to admin / appearance / menus. Create a second menu (click on + tab on top near “topmenu” we already created), I called it “footer menu”. Add items to the new menu.
Notice “Secondary Navigation” in Theme Locations. Pick “footer menu” in secondary navigation select box. Click Save and we are done. Now you can make any custom changes in this menu with all supported wp3 ease.

This entry was posted in Templates, WordPress and tagged , , . Bookmark the permalink.

14 Responses to How to Add Second Navigation Menu to WordPress Child Theme (with Twenty Ten Parent)?

  1. nurit says:

    Hi Its not working for me it doesn’t add the secondary one in the appearances-> menu

  2. EntrustHost says:

    Hi,

    I just added the secondary menu to a child theme I am developing for twentyten. it was good, I liked it, but I want us to get a bit further. You know, the standard way that menu are being passed by wordpress to the template in HTML is using unordered list but I want the menu to be parsed our using , do you know of a way we can archive this in WordPress?

  3. EntrustHost says:

    Yeah, I just figured that out and I have styled the menu with unordered list. thanks.

  4. Isabella says:

    Thank God! Somenoe with brains speaks!

  5. kim says:

    For TwentyEleven, the code is slightly different for the child theme’s functions.php:
    register_nav_menu( 'secondary', __( 'Secondary Menu', 'twentyeleven' ) );

  6. Kenki says:

    It is not working

    • jMike says:

      Hi,
      Thank you for the great tut….
      I tried to do this on another custom theme I had and it didn’t work for me either at first. I had to add the add_action in the function.php file before the backend would change:

      ex…
      add_action(‘init’,’your_function_name_here’);
      :::::::::::::::::::::::::::::: Hope this helps =)

  7. Marla says:

    Can you create a second navigation bar for the Blogolife theme?

  8. Patrick says:

    Thanks a lot! Worked fine for me!

  9. Chris says:

    It works great …. but the responsive menu doesn’t work i.e. on a mobile the new menu collapses down to a button but when you click it it open the main site menu. I know it is something to do with functions.js (working on TwentyTwelve) but dont know more than basic JS and cannot work it out …. HELP!

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre class="">

Current ye@r *