Jobify (Astoundify)

Knowledgebase Docs » UberMenu 3
USEFUL? 1
UberMenu 3

Automatic integration with Jobify will wrap UberMenu in the theme’s menu, causing issues on mobile. To avoid this, we will use Manual Integration to prevent the theme’s menu from interfering.

Manual Integration

1. Create a child theme

You’ll want to make all of your changes in a child theme in order to preserve them when you update the Beaver Builder parent theme in the future

2. Copy the header.php into the child theme

Find your header.php in the Jobify theme and copy it into your child theme. We’ll make the edits in the child theme’s header template.

3. Replace the theme’s menu system

In the child theme’s header.php, conditionally replace the theme’s menu with UberMenu:

Before:

<nav id="site-navigation" class="site-primary-navigation slide-left">
	<a href="#" class="primary-menu-toggle"><i class="icon-cancel-circled"></i> <span><?php _e( 'Close', 'jobify' ); ?></span></a>
	<?php get_search_form(); ?>
	<?php wp_nav_menu( array( 'theme_location' => 'primary', 'menu_class' => 'nav-menu-primary' ) ); ?>
</nav>

<?php if ( has_nav_menu( 'primary' ) ) : ?>
<a href="#" class="primary-menu-toggle in-header"><i class="icon-menu"></i></a>

After:

<?php if( function_exists( 'ubermenu' ) ): ?>
	<?php ubermenu( 'main' , array( 'theme_location' => 'primary' ) ); ?>
<?php else: ?>
	<nav id="site-navigation" class="site-primary-navigation slide-left">
		<a href="#" class="primary-menu-toggle"><i class="icon-cancel-circled"></i> <span><?php _e( 'Close', 'jobify' ); ?></span></a>
		<?php get_search_form(); ?>
		<?php wp_nav_menu( array( 'theme_location' => 'primary', 'menu_class' => 'nav-menu-primary' ) ); ?>
	</nav>

	<?php if ( has_nav_menu( 'primary' ) ) : ?>
	<a href="#" class="primary-menu-toggle in-header"><i class="icon-menu"></i></a>
	<?php endif; ?>
<?php endif; ?>

Configuration

In the UberMenu Control Panel, you may want to:

– Set the Menu Bar Alignment to “Right”
– Change the skin to Vanilla
– Change the top level item color to #494949
– Change the top level font weight to bold
– Change the top level text transform to uppercase

These settings approximate the default theme menu