This tutorial will explain how to add and edit the Accordian Module in the Divi Visual Builder for the Divi WordPress Theme.

Take A Test Drive

Sign up for a 15 day free trial to our powerful WordPress Hosting Platform.  Take advantage of everything we have to offer for free.  No credit card required!

Transcript from Divi Tutorial

An accordion module is used for different applications. One is to create a FAQ section on your website. This way, pages that have a lot of questions, you’ll have a list of questions that the website’s visitor may click on to for more information.
Go into ‘Pages’ on the ‘Dashboard’. And go to the page you want to add an accordion module to.

Click on the ‘Use the Divi Builder’, then you’re going to use the ‘Visual Builder’ so you can see what the coordinates will look like as you’re building it.

s1
Click on the green (+) button and select ‘Insert a Row’, and choose the ‘full-width’ row. Then when ‘Insert Module’ pops up, select ‘Accordion’.
s2 s3
Click on ‘Add a New Item’. Then give it a title and add in the information you want to go along with it in the field below the title.
s4
(With using the Visual Builder, you can click on the title you just created and it will preview the added information once clicked.)

Next, duplicate the module and then go in and change the title you want to be displayed, then add the information you want to be shown when the title has been selected.

s5 s6
When you select one of the titles, the information will hide away and show the next choice.
s7
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Designing your Accordion Module;

In the ‘Accordion Settings’ you can choose a different toggle color for when the module has been selected.

You can change the text color and font as well.

There’s also the option to choose the background color.

Make sure to preview everything while you’re building it so that it’s exactly the way you want it to appear.

s8

Hit ‘Save Changes’

 
Tutorial and transcript were done by, Jimi Blevins, with Mozaic Technology

Transcript edited by, Alexis Stucker, interning with Mozaic Technology