I use Divi or Extra as themes on most of my websites. However, I was finding that for websites in which I had a lot of links, on mobile the menu was extremely long, some parts did not show, and sometimes there was a weird effect where the menu seemed to cut through some of the elements in the page header. In short, I needed a collapsible menu for Divi.
However, I was using the fullwidth menu module in the theme builder and I was using the Extra theme — though the theme builder is the same between both Divi and Extra.
Elegant Themes offers this method for creating a nesting menu. However, I was inpatient and would have had to customize it further for my menu which was three levels deep.
This post offered some very nice-looking customizations for the mobile menu but I found that it didn’t work well with my fullwidth menu.
The link cited here (from Josh Hall) worked the best for me — it worked in Extra and it worked with my fullwidth menu. I’m not adding the code here as it’s his, but if you go to the website and find it, don’t use the code that’s in the post — navigate down to the comment from October 2019 and use the updated code that’s listed there, which will work with the version of Divi that’s current at the time I’m writing this post.
Here’s the Menu:
