This is a guide for UberMenu 2. If you are integrating UberMenu 3, please see the UberMenu 3 Integration Guide.
UberMenu works by applying filters to a WordPress 3 Custom Nav Menu. These menus are inserted into the page via your WordPress Theme. Normally, UberMenu automatically replaces your theme’s WordPress 3 custom menu, when WordPress 3 custom menus and theme locations are supported. If your theme does not already properly support custom menus, or if you wish to add an additional menu, you can add support by turning on UberMenu Easy Integration and adding a line of PHP code. Note: you still need to be running WordPress 3.3 or above for this to work.
Setting up Easy Integration involves three steps:
Need to add multiple menus to your theme on different pages? Check out UberMenu Direct, which does the same thing as Easy Integration but with configurable theme locations
1. Activating WordPress 3 Custom Menu Support
- Navigate to Appearance > UberMenu
- Under Theme Integration, enable Easy Integration
- Click Save Settings
This will automatically register a theme location called “UberMenu”
2. Placing the Menu
If you have already applied uberMenu_easyIntegrate() via a filter or hook (following one of the theme integration guides, for example), you can skip this step – the hook code has already placed the menu.
Option 1: In a PHP Template
Now that the theme supports WP3 Menus, we’ll need to actually insert the menu somewhere in your theme template.
It is always recommended that you create a Child Theme and make your edits there, for maximum forward compatibility and ease of maintenance with your theme. Most premium themes include a starter child theme in the download package.
Replacing an existing menu
If you want to replace your theme’s old menu, you’ll need to locate the original menu code, which will generally look like one of these three functions:
wp_nav_menu
without proper use of the theme_location parameter.- wp_list_pages
- wp_page_menu
though it can vary depending on your theme.
Once you’ve removed the old menu and any surrounding <ul>
tags, you’ll want to insert the following PHP
code where the menu should be displayed. Usually this would be inserted in your theme’s header.php file, but again this may vary depending on your theme and your goals.
Adding a new menu
If you are adding an additional menu, you’ll want to add the code wherever you want the menu to display, generally within your theme’s header.php
.
Easy Integration PHP Code
Here’s the one line of code to add to your template:
<?php uberMenu_easyIntegrate(); ?>
Note: The above menu call should never be located inside <ul>
tags, even if your theme’s default menu is. If you are removing residual styling, you may also need to edit or remove the class or IDs of the div/nav elements surrounding the Easy Integration code.
Option 2: In a widget or content area
If you are adding UberMenu to a widget area / sidebar or content area, normally you’ll want to add the Easy Integration shortcode within a text widget to place your menu. You can also place the PHP above in the sidebar.php, for example.
[uberMenu_easyIntegrate echo="false"]
You place the text widget containing the shortcode in a widget area defined by your theme, not in a custom UberMenu Widget area.
3. Activating the UberMenu Theme Location
Completing the above two steps should successfully enable your theme to work with UberMenu, giving you an “UberMenu” theme location in your menus panel. Now just configure UberMenu as usual!
Specifically, you will need to set the menu in the UberMenu [Easy Integration] Theme Location
Activate UberMenu on the theme location as you would normally
You will need to activate the UberMenu [Easy Integration] location
Assign your menu to the UberMenu [Easy Integration] theme location
WordPress 3.6+
In WordPress 3.6, the theme locations settings were moved. They now appear on the Appearance > Menus > Manage Locations tab
as well as below the menu
WordPress 3.5 and earlier
Prior to WordPress 3.6, the Theme Locations settings appear in the main Appearance > Menus screen