Mobile Menu not working

Read our post on solutions to fix the theme mobile menu not working. Check for javascript errors or do a plugin test.

By

: Posted on

Kaira WordPress themes have a much neater Mobile Menu which slides out when clicking to view the Menu.

The mobile menu in Kaira themes

Below is a screenshot of what the Kaira WordPress themes mobile menu looks like.

Kaira WordPress Themes neat Mobile Menu

This uses more specific CSS and Javascript to create a better looking mobile menu for your theme as we didn’t like the default hovering menu which a lot of themes offer.

How to fix the Mobile menu not working

If your mobile menu on your free or premium theme is not working, it is most likely due to your website having a javascript error. Often Javascript errors will be from plugins that have been installed, either conflicting or simply having a bug… It can come from the theme itself but this is less likely.

Check the browser console for javascript errors

To check if your website has any javascript errors, we usually recommend using the Chrome browser, but you can do this in most browsers.

Go to your Home page and right click anywhere on the site and then to go Inspect.

This method of checking for javascript errors will be similar in all browsers but might be named slightly different.

WordPress theme mobile menu not working - Inspect Element - Kaira

This will then open the developer section of the browser where you can view all the code of the website.

Select the Console tab which will open the section to see if there are any errors or console outputs on the website.

Below is an example of what a javascript errors will look like… Bright red messages with you can see don’t look very good.

WordPress theme mobile menu not working - Javascript error - Kaira

If your website has any javascript errors, you will see the text in the Console… This is usually the reason why your mobile navigation button does not work, as the javascript error will break the rest of the javascript loaded below it.

From the console section you can usually tell where the error is coming from by hovering over the file names on the right-hand side (Eg: scripts.js?ver=4.7:15)… You’ll then see the path to the file display in a tooltip, and you can often tell from there which plugin it’s coming from by /wp-content/plugins/<pluginName>/

Do a plugin test to fix the mobile menu not working

If you find out which plugin is causing the issue from the console output, then go to Dashboard -> Plugins in your WordPress dashboard and try deactiivating that plugin to see if that fixes it.

Otherwise, another way to do this test without doing the console check is to go straight to the Plugins section in your WorDPress Dashboard and deactivate all of your plugins, then check if the mobile menu works. If it does, then start activating the plugins one by one and check the mobile menu after each one until you find out which plugin is causing the problem.

Once you find out which plugin it is, you can either find a new plugin that can add the same functionality to your website, or contact the plugin developers to fix the error.

Hope this helps!