Add this code into function.php of your child theme.
Please make all changes to the child theme files, and do not add the code directly to the theme files, otherwise after updating the theme your fixes will be lost
header.php
<?php
/**
* The header for our theme.
*
* This is the template that displays all of the <head> section and everything up until <body>
*
* @link https://developer.wordpress.org/themes/basics/template-files/#template-partials
*/
namespace YOOtheme;
/**
* @var Config $config
* @var View $view
*/
list($config, $view) = app(Config::class, View::class);
$config->addAlias('~site', '~theme.site');
$config->addAlias('~sidebar', '~theme.main_sidebar');
// Set view
$layout = $config('~theme.page_layout', '');
// Page
$attrs_page = [];
$attrs_page_container = [];
$attrs_image = [];
$attrs_media_overlay = [];
$attrs_page['class'][] = 'tm-page';
if ($config('~site.layout') == 'boxed') {
$attrs_page['class'][] = $config('~site.boxed.alignment') ? 'uk-margin-auto' : '';
$attrs_page['class'][] = $config('~site.boxed.margin_top') ? 'tm-page-margin-top' : '';
$attrs_page['class'][] = $config('~site.boxed.margin_bottom') ? 'tm-page-margin-bottom' : '';
$attrs_page_container['class'][] = 'tm-page-container uk-clearfix';
// Image
if ($config('~site.boxed.media')) {
$attrs_image = $view->bgImage($config('~site.boxed.media'), [
'width' => $config('~site.image_width'),
'height' => $config('~site.image_height'),
'size' => $config('~site.image_size'),
'position' => $config('~site.image_position'),
'visibility' => $config('~site.image_visibility'),
'blend_mode' => $config('~site.media_blend_mode'),
'background' => $config('~site.media_background'),
'effect' => $config('~site.image_effect'),
'parallax_bgx_start' => $config('~site.image_parallax_bgx_start'),
'parallax_bgy_start' => $config('~site.image_parallax_bgy_start'),
'parallax_bgx_end' => $config('~site.image_parallax_bgx_end'),
'parallax_bgy_end' => $config('~site.image_parallax_bgy_end'),
'parallax_easing' => $config('~site.image_parallax_easing'),
'parallax_breakpoint' => $config('~site.image_parallax_breakpoint'),
'parallax_target' => 'body',
]);
if ($config('~site.image_effect')) {
$attrs_image['class'][] = 'uk-position-cover uk-position-fixed';
} else {
$attrs_page_container = array_merge_recursive($attrs_page_container, $attrs_image);
$attrs_image = [];
}
// Overlay
if ($config('~site.media_overlay')) {
$attrs_page_container['class'][] = 'uk-position-relative';
$attrs_media_overlay['class'][] = 'uk-position-cover';
$attrs_media_overlay['style'] = "background-color: {$config('~site.media_overlay')};";
}
}
}
// Main section
$attrs_main_section = [];
$attrs_main_section['class'][] = 'tm-main uk-section uk-section-default';
$attrs_main_section['class'][] = $layout == 'blog' && $config('~theme.blog.padding') ? "uk-section-{$config('~theme.blog.padding')}" : '';
$attrs_main_section['class'][] = $layout == 'post' && $config('~theme.post.padding') ? "uk-section-{$config('~theme.post.padding')}" : '';
$attrs_main_section['class'][] = $layout == 'post' && $config('~theme.post.padding_remove') ? 'uk-padding-remove-top' : '';
// Main container
$attrs_main_container = [];
if ($layout == 'post') {
if ($config('~theme.post.width')) {
$attrs_main_container['class'][] = $config('~theme.post.width') == 'default' ? 'uk-container' : "uk-container uk-container-{$config('~theme.post.width')}";
}
} elseif ($layout == 'blog') {
if ($config('~theme.blog.width')) {
$attrs_main_container['class'][] = $config('~theme.blog.width') == 'default' ? 'uk-container' : "uk-container uk-container-{$config('~theme.blog.width')}";
}
} else {
$attrs_main_container['class'][] = 'uk-container';
}
?>
<!DOCTYPE html>
<html <?php language_attributes() ?>>
<head>
<meta charset="<?php bloginfo('charset') ?>">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="shortcut icon" href="<?= $config('~theme.favicon') ?>">
<link rel="apple-touch-icon" href="<?= $config('~theme.touchicon') ?>">
<?php if (is_singular() && pings_open(get_queried_object())) : ?>
<link rel="pingback" href="<?php bloginfo('pingback_url') ?>">
<?php endif ?>
<?php wp_head() ?>
<script type="text/javascript">
if (screen.width<960) {
jQuery(document).ready(function($) {
$( slideout ).addClass( 'sidr hide' );
//put IDs for sidebar and toggle in vars
var toggle = "#menu-toggle";
var slideout = "#tm-sidebar";
//calculate the width of the mobile sidebar and put inverse in var
var slideoff = -Math.abs( $( slideout ).width() );
//add margin-left to mobile sidebar to push off canvas
$( slideout).css( "marginLeft", slideoff );
//When toggle is clicked show the slideout
$( toggle ).on('click', function () {
if ( $( slideout ).hasClass( 'hide' )) {
$( slideout ).removeClass( 'hide').addClass( 'unhide' ).animate({
opacity: 1,
marginLeft: 0,
}, 500, function() {
//I can haz callback?
});
} else {
$( slideout ).animate({
opacity: 0,
marginLeft: slideoff,
}, 500, function() {
$( slideout ).addClass( 'hide').removeClass( 'unhide' );
});
}
}); //end slideout function
}); //end noConlict
}
</script>
</head>
<body <?php body_class((array) $config('~theme.body_class')) ?>>
<?php
$groovy_menu_installed = false;
if ( function_exists( 'groovy_menu' ) ) {
$groovy_menu_installed = true;
groovy_menu();
}
?>
<?php if ($config('~site.layout') == 'boxed') : ?>
<div<?= $view->attrs($attrs_page_container) ?>>
<?php if ($attrs_image) : ?>
<div<?= $view->attrs($attrs_image) ?>></div>
<?php endif ?>
<?php if ($attrs_media_overlay) : ?>
<div class="uk-position-cover"<?= $view->attrs($attrs_media_overlay) ?>></div>
<?php endif ?>
<?php endif ?>
<?php if ( ! $groovy_menu_installed && $config('~site.layout') == 'boxed' && $config('~site.boxed.header_outside')) : ?>
<?= $view('~theme/templates/header') ?>
<?php endif ?>
<div<?= $view->attrs($attrs_page) ?>>
<?php if ( ! $groovy_menu_installed && !($config('~site.layout') == 'boxed' && $config('~site.boxed.header_outside'))) : ?>
<?= $view('~theme/templates/header') ?>
<?php endif ?>
<?php dynamic_sidebar("top:section") ?>
<?php if (!$config('app.isBuilder')) : ?>
<?php if ( wp_is_mobile() ) : ?> <a id="menu-toggle" class="second" title="<?php _e( 'Navegar y Filtrar', 'yt1300' ); ?>" href="#">Navegar y Filtrar por Categorías, Marcas, Tipos,...</a> <?php endif; ?>
<div id="tm-main" <?= $view->attrs($attrs_main_section) ?> uk-height-viewport="expand: true">
<div<?= $view->attrs($attrs_main_container) ?>>
<?php if (is_active_sidebar('sidebar')) :
$grid = ['uk-grid'];
$grid[] = $config('~sidebar.gutter') ? "uk-grid-{$config('~sidebar.gutter')}" : '';
$grid[] = $config('~sidebar.divider') ? 'uk-grid-divider' : '';
?>
<div<?= $view->attrs(['class' => $grid, 'uk-grid' => true]) ?>>
<div class="uk-width-expand@<?= $config('~sidebar.breakpoint') ?>">
<?php endif ?>
<?php if ($config('~site.breadcrumbs')) : ?>
<?= $view->section('breadcrumbs') ?>
<?php endif ?>
<?php endif ?>
function.php
<?php
if ( ! defined( 'ABSPATH' ) ) {
exit;
}
// ------------------------------------------------------
// Groovy Menu plugin integration
// ------------------------------------------------------
if ( ! function_exists( 'gm_child_show_groovy_menu' ) ) {
function gm_child_show_groovy_menu() {
// Work only if Groovy Menu plugin active.
if ( function_exists( 'groovy_menu' ) ) {
global $wp_filter;
if ( ! isset( $wp_filter['wp_nav_menu_args'] ) || ! is_object( $wp_filter['wp_nav_menu_args'] ) ) {
return;
}
unset( $wp_filter['wp_nav_menu_args'] );
}
}
}
Note: You can find the link on Child Theme for YooTheme under
Groovy Menu > Integration section