Divi Mobile Menu Not Working And How To Fix It

You click on the hamburger icon and it looks like the mobile menu is hidden behind your top section. Does this happen to you? In that case, I have a couple of solutions for you.

Solution #1 update Divi

First, try to update Divi and see if that solves your problem. Divi constantly comes with updates for bug fixes so this just might do the trick.

Solution #2 set the overflow to visible

If you are using a Global Header in Divi > Theme Builder then go there and open the row where your menu module is. Go to the Advanced tab > Visibility set the horizontal and vertical overflow to visible.

Divi set overflow to visible

Then under position set the Position to Relative.

Set row position to relative in Divi

Solution #3 turn safe mode on

Go to Divi > Support Center and enable safe mode. In safe mode, all plugins and child themes will be disabled. Now check again if your mobile menu is working. If it is working then likely one of your plugin or child themes is conflicting with the mobile menu. Turn safe mode off and disable your plugins one at a time to check which one is causing the issue.

Turn safe mode on in Divi

Solution #4 ask me

If the above solutions did not work then let me know in the comments with a link to your site and I will take a look at it.

You might also like…

51 thoughts on “Divi Mobile Menu Not Working And How To Fix It”

      • Hi, can you share your solution? I’m working on a site where the mobile menu has collapsable menus. The sub-menu links work but the parents do not. Any suggests would be great! I already checked that the Disable top tier dropdown menu links is disabled.

        Reply
  1. I’ve inherited a website – klscarves.com and for the life of me can’t get the menu bar to appear on mobile view.

    I’ve entered safe mode but no change. Any suggestions?

    Reply
  2. Hello!

    I did a super simple build here: http://www.eldonspainting.com but the mobile menu doesn’t work when viewed on a mobile device. The hamburger is there, and I can see that the menu drops down, but it’s tucked behind the content on the page. I’ve adjusted the overflows, and made the position relative. It didn’t work. I tried it in safe mode, but it didn’t change anything.

    What do I do???

    Thank you. 🙂

    JM

    Reply
  3. Hi, thank you for the article. My problem is that I have a one page website. When I click on my menu items it just scroll up and down the page. On desktop this works great but on mobile it doesn’t work at all. I have added the css ID to both desktop and mobile versions. Website is a dev site. https://zingitdev.co.za

    Reply
  4. The main menu wasn’t working on mobile. Strangely, the hamburger menu was only broken on the landing page, where an “a” appeared in place. Solution #2 fixed it. Thank you!
    (helenakorpela.com)

    Reply
    • Hi Anthony,

      Did you have a Divi update?

      It seems you are using 2 menus, one for desktop and one for mobile. try to disable the mobile one and only use the desktop one (make this one also visible for mobile).

      Reply
      • I delete the mobile one but nothing change. I have trying all the things in your article. And i don’t have a divi update in my dashboard. There is an other way to upgrade ?

        Reply
      • Until i have put lite speed cache and wp all in one security, i have this problem, and other, like module of divi plus wich doesn’t work…

        Reply
  5. Hello,

    I am having the same issue on my website and have been unable to resolve it through different solutions online. Can you please help! It would be greatly appreciated.

    Website: https://trucesoftware.com

    Thank you very much!

    Reply
    • Hi Connor,

      I checked your website on my mobile, but it is working on my end.

      What does not work for you?

      Reply
  6. Hi there! The hamburger menu on the home page of williams.wp.gravityadmin.com is working properly, but on the interior pages (Get A Quote, Free Consultation), it’s hidden behind the content on the page. Any recommendations/help to fix it?

    Reply
    • Hi Stephanie,

      Sorry for the late reply. I checked your site and it seems you have fixed it I do see the hamburger menu.

      Reply
    • Hi Matt,

      I see the following issue: when you open the mobile menu it collapses but when you close it, it redirects to the home page.

      You created a 2 column structure and then pushed the menu with a – margin in position so it sits on one line with your logo.

      I think this is where it goes wrong.

      Try to make a one-column structure and place the logo in your menu module.

      Reply
  7. We have discovered an issue with the Divi theme when on mobile. The header menu items (linked to just “#”) which should expand to show the sub-menus don’t go anything and the “+” signs don’t appear on the navigation – UNLESS – you are logged into the wp-admin. If logged in, the nav works great. If not, it’s not working.

    Here’s the site: https://wfw.org
    These items should all have sub-menus:
    About
    Our School
    Enroll Now
    Ways to Support

    Please help!

    Reply
    • Hi,

      I checked your site.

      The + symbol does show up for me on mobile.

      Is this collapsing mobile menu code from my tutorial or a different one?

      Reply
    • Hi Rob,

      Try the safe mode feature in Divi. Go to Divi > Support Center and activate Safe mode.

      If your menu is working then it is likely one of your plugins that is causing this or perhaps you are using some additional code?

      Reply
  8. I was able to fix the problem by turning off the Defer jQuery and jQuery Migrate button on Divi > Theme Options > General > Performance.

    Reply

Leave a Comment

0 Shares
Share
Pin
Tweet