Bazar (YIT)

Bazar creates residual styling that interferes with UberMenu’s functionality. To resolve this, we’ll take advantage of the theme’s pluggable yit_header() function to override the theme’s menu wrapper.

The crux of the edit is to change the hard-coded theme menu wrapper from "nav" to "nav-uber" to eliminate the residual styling.

1. Install the child theme

Install and activate the Bazar child theme, which is included with Bazar. Here are the YIT instructions: Activating and using the child theme

2. Make a copy of the theme’s header template in the child theme

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. Edit the ID to eliminate residual styling

Find this code in yit_header.php

<div id="nav">

and change it to

<div id="nav-uber">

4. Replace the theme’s header with the modified header

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.

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

5. Adjust layering if necessary

If your submenu is obstructed by the slider or main content on the site, add this z-index code in the CSS Tweaks to layer UberMenu on top.

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