If your ElementsKit off-canvas menu isn’t opening when clicked, it’s typically due to JavaScript conflicts, incorrect widget settings, or CSS overrides. This guide walks you through 7 proven fixes to resolve the issue, with troubleshooting scripts and preventive tips.

🔧 1. Check for JavaScript Conflicts (Most Common Fix)

Why it happens:
Other plugins or themes may load incompatible jQuery scripts, breaking ElementsKit’s interactivity.

How to fix:

1. Deactivate plugins:

   • Go to Plugins → Installed Plugins.

   • Deactivate all plugins except Elementor and ElementsKit.

   • Test the menu button. If it works, reactivate plugins one by one to identify the culprit.

2. Add a jQuery conflict patch:
   Insert this code in Appearance → Theme File Editor → functions.php:

add_action( 'wp_footer', function() { ?>
<script>
jQuery(document).ready(function($) {
// Fix '$' shorthand conflict
if (typeof $ === 'undefined') $ = jQuery;
// Manually trigger off-canvas
$(document).on('click', '.elementskit-header-offcanvas-toggler', function(e) {
e.preventDefault();
$('.elementskit-offcanvas').toggleClass('elementskit-Offcanvas-open');
});
});
</script>
<?php }, 99);

🎨 2. Override Theme CSS

Common with themes like Avada, Divi, or Astra:
Theme CSS may hide the off-canvas menu.

Debug & Fix:

1. Right-click the menu button → Inspect.

2. Check if .elementskit-offcanvas has display: none or low z-index.

3. Add this to Customize → Additional CSS:

.elementskit-offcanvas { 
display: block !important; 
z-index: 99999 !important; /* Force visibility */ 
} 
.elementskit-Offcanvas-open { 
transform: translateX(0) !important; /* Fix positioning */ 
}