Your Inspiration Themes (YIT) [Bazar,Room09]

This solution is known to work with multiple, if not all, YIT themes. Including: Room09 , Bazar

The YIT framework introduces major residual styling (see also: residual styling troubleshooting guide) and residual scripting into the menu system.

All we need to do is change the id=”nav” to id=”nav-uber”, but since the menu is not printed directly in the header.php, we can’t use the normal WordPress template system to just override the header template. Instead, we can use YIT’s template system to provide our own replacement nav template. Here’s what needs to be done:

1. Create a child theme for the YIT theme with style.css, functions.php, and yit_header.php template
2. Create our own yit_header.php template which will replace the default YIT header template – copy the theme/templates/header/header.php into the new header. This template will contain a single modification – change id="nav" to id="nav-uber"
3. Override the pluggable yit_header() function so we can replace the template with our own. Add this code to the child theme’s functions.php:

   function yit_header() {
       require_once( 'yit_header.php' );
   }
   

4. Activate the child theme and set a menu in the theme location in Appearance > Menus

Bazar-specific Instructions

1. Activate the Bazar Child Theme (don’t forget you’ll need to re-assign/activate your menus). It already contains most of the files you need.
2. Copy bazar/theme/templates/header/header.php from the parent theme into the main directory of the child theme (bazar-child/) and rename it yit_header.php.
3. Find this code in yit_header.php: id="nav" and change it to id="nav-uber"
4. Add this PHP to your bazar-child/functions.php file to override the pluggable yit_header() function so we can replace the template with our own. Add this code to the child theme’s functions.php:

   function yit_header() {
    require_once( 'yit_header.php' );
   }
   

5. If your submenu is obstructed by the slider, you can add this CSS to layer the menu on top:

   #header{
   	position:relative;
   	z-index:20;
   }
   .revolution-wrapper{
   	position:relative;
   	z-index:10;
   }
   

Room09

For the Room09 theme, I’ve created a child theme that does all of this for you. Just install and activate it, then set up your menu as usual.

Download the Room09 Child Theme

The same child theme would work for any YIT framework theme, you’d just need to adjust the style.css to work with the relevant theme.