Enabling Wordpress Menus

This post looks at enabling Wordpress menus - this great feature has been available since Wordpress 3 +.  For all those themes that don't have this feature enabled this is how to do it.

Step 1. Open up your your functions.php file and add the following code snippet:

register_nav_menus(array(‘primary’=>__(‘Primary Menu’),));

You can add as many menus throughout your theme as you like. To do this you'll need to add this:

register_nav_menus(array(‘primary’=>__(‘Primary Menu’),

‘secondary’=>__(‘Secondary Menu’),));

Step 2. Then you'll need to replace the existing menu items with this:

'menu_order', 'container_class' => 'menu-header' )  ); if (is_home()) ?>

Open the header.php file a look for the existing navigation div. Then delete your menu items and replace it with the above code between your unordered lists HERE

For example:


    'menu_order', 'container_class' => 'menu-header' )  ); if (is_home()) ?>

Step 3. Once you've added this go to your Appearance > Menus and add a name for your new menu, press the create menu button. Then choose the "primary" menu from the drop down in the Theme Locations. Save it and you're done.

After enabling Wordpress menus the CSS active state is not showing!

One thing you may find is that the "active" state for your menu does not work. You'll need to add some additional CSS to your parent div for this to work correctly. Basically you want Wordpress to show the active state class for parent and child elements.

Add this CSS code:

#navigation .current_page_item a:link, #navigation .current_page_item a:visited{
color: #000;
}

That's it, enabling Wordpress menus has never been so easy. If you need any help with website development works just ask!

Work with us

Work with us

Think we’d be a good fit for your business?

Let’s chat through your requirements. Email or call us on 01943 605894