How to Make the Divi Accordion Closed

by | Aug 17, 2019 | Divi tutorials | 3 comments

How to Make the Divi Accordion Closed

By default, the first toggle on the Divi accordion is open and there is no option to make it closed. Fortunate there is a simple trick to make the first toggle also closed.

I will show you two methods of how you can make the accordion closed. The first method is a clever way to hide the first toggle with CSS (and just don’t use the first toggle and start your content on the second one). The second method we will close the toggle with some jQuery code.

You can also use the Divi Booster plugin to close the first tab.

Method 1: hide the first toggle with CSS

This is a very easy and simple method, first create an accordion with a couple of toggles. In my example, I have created 3 toggles.
Accordion example with 3 toggles
Now open the first toggle and go to the advanced tab. Under Custom CSS > Main Element fill in the following CSS:
Hide the first accordion toggle with CSS

And that’s it! You have now hidden the first tab and start with tab 2, and this one is closed by default.

Keep in mind that you can’t use the first toggle now, we have it hidden. So start with toggle 2.

Method 2: use jQuery to close the first accordion tab

Place the following jQuery in Divi > Theme Options > Integration > Add code to the < head > of your blog
This jQuery code will close the accordion tab by default. With this method, you can still use the first toggle.

3 Comments

  1. Ken

    Thanks ! I appreciated the Help!

    Reply
  2. Scott Banks

    Hi Mark,
    Thanks for the lesson on the Divi accordian feature. I’d been experimenting with alternatives for same reason and got close – using a blank first accordian tab – but didn’t think to use your CSS technique. Problem solved now though. Appreciate your clarity and help!

    Reply
  3. Guillaume

    Thanks for the trick, so useful ! 😉

    Reply

Submit a Comment

Your email address will not be published. Required fields are marked *

2 Shares
Share2
Tweet
Pin
Buffer