0,00 USD

No products in the cart.

Saturday, February 27, 2021
0,00 USD

No products in the cart.

The Best Method I’ve Found for Creating a Collapsible Menu in Divi and Extra on Mobile

Home » Books » The Best Method I’ve Found for Creating a Collapsible Menu in Divi and Extra on Mobile

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:

Divi collapsing menu
The menu with one of the tabs open.

How many hot cups of coffee does this post or page deserve?

Click on an icon to rate it.

Average rating: 0 / 5. Vote count: 0

No votes so far! Be the first to rate this post.

As you found this post useful...

Care to share?

We are sorry that you found this post to be like a weak cup of decaf.

Let us improve this post!

Tell us how we can improve this post?

Cheryl is a former Occupational Therapist and WordPress enthusiast who became a writer in some parallel universe and occasionally, but infrequently, publishes things in this one. She writes two blogs (or is it three) which she won't quit because she knows that blogs, in her case, are like a hydra and if she cuts one off two more will take its place. When she's not doing that, she enjoys hiking, cycling, kayaking (formerly fast, now ebike), messing around with Adobe illustrator, making assorted things, meditating (though she wouldn't call that "like," and reading. She normally doesn't speak about herself in the third person, but she sometimes uses "we" in the royal sense while writing this blog. She lives in Poulsbo, WA with her spouse, her youngest adult daughter, a very old mutt, and a Siamese cat.
Notify of
Inline Feedbacks
View all comments

You may also be interested in:

Adding Google Analytics to WordPress

Zip has installed an SEO plugin. So he probably wants to be able to find out how many visitors are actually coming to his website and what pages they are viewing. In this post, he'll install Google Analytics using a plugin so he can start viewing analytics data for his new website.

How to Use Yoast to Configure Your Post for SEO

Zip's added the Yoast SEO plugin to his blog. Let's look at how he can optimize a post (or page) for search engine optimization using the Yoast plugin as well as some things to keep in mind when using this helpful plugin.

Sloth Installs an SEO Plugin (Why You Should Use an SEO Plugin and How to Configure Yoast SEO)

Zip has completed basic design work on his blog. Next, he's going to move on to Search Engine Optimization. In this post, we briefly look at some of the plugins available to help with SEO, and install and configure the Yoast SEO plugin.
Share via
Liked it? Follow us on social media!
Thanks for sharing!
If you found this post worth sharing, consider following us on social media (if you don't already).
And if you have something you would like to share, consider submitting a post. Find out more here.
Send this to a friend