Jarida (TieLabs)

Are you using UberMenu 3? Please see the UberMenu 3 Jarida Integration Guide

When you integrate UberMenu into Jarida, you’ll find that there is residual styling (see also: residual styling troubleshooting guide) from the theme’s #main-nav nav element. To integrate UberMenu, we simply need to remove this residual styling to prevent the theme from breaking UberMenu. So we just need to change the ID so that the styles no longer apply.

Here is the original code in the theme’s header.php, with the main-nav ID

<nav id="main-nav" class="fade-in animated2<?php echo $stick; ?>">
	<div class="container">				
	<?php $orig_post = $post; wp_nav_menu( array( 'container_class' => 'main-menu', 'theme_location' => 'primary' ,'fallback_cb' => 'tie_nav_fallback',  'walker' => new tie_mega_menu_walker()  ) ); $post = $orig_post; ?>
	</div>
</nav><!-- .main-nav /-->

Here is what the code looks like after we change the ID to main-nav-uber

<nav id="main-nav-uber" class="<?php echo $stick; ?>">
	<div class="container">		
	<?php $orig_post = $post; wp_nav_menu( array( 'container_class' => 'main-menu', 'theme_location' => 'primary' ,'fallback_cb' => 'tie_nav_fallback',  'walker' => new tie_mega_menu_walker()  ) ); $post = $orig_post; ?>
	</div>
</nav><!-- .main-nav /-->

Before, with residual theme styling:

After, using child theme:

Child theme

I’ve provided a child theme which includes a modified header template. Just download the child theme, upload the zip through the WordPress theme installer, and activate the child theme. If you are already using a child theme, just copy the header.php into your child theme and make the ID edit as shown above (or use the header.php provided in the zip).

Download Child Theme

Don’t forget to re-assign your menu to the Jarida theme location in Appearance > Menus > Manage Locations after installing and activating the child theme.

Jarida Menu Settings

Please note that the menu settings in the Jarida settings are specific to the Jarida menu, and won’t apply to UberMenu, for example the sticky setting. To make your menu sticky, you could either alter the Jarida javascript to target the new menu ID rather than Jarida’s original menu ID, or you could use the UberMenu Sticky Extension.