An accordion is very similar to a tab, but has a vertical orientation. It is similarly useful for displaying more content in smaller spaces. To create an accordion you will need to use the [accordion] shortcode and the [section] shortcode. The setup is exactly the same as before, but the accordion shortcode does not have any parameters. The section shortcode has a title parameter which you must fill out. If you don’t know what shortcodes are we recommend you read our article on How to Use Shortcodes. The parameters of this shortcode are:

title
The title of the section which will be used in the accordion

Examples

[accordion]
[section title='My First Accordion Section']
This is the content of this section
[/section]
[section title='My Second Accordion Section']
This is the content of the second section
[/section]
[/accordion]

[accordion]
[section title=’My First Accordion Section’]
This is the content of this section
[/section]
[section title=’My Second Accordion Section’]
This is the content of the second section
[/section]
[/accordion]

[accordion]
[title='My First Accordion Section']
[row]
[column width='4']
<img src="http://bonsaished.com/musico/wp-content/uploads/sites/3/2013/03/photodune-421792-female-singing-into-mic-m-150x150.jpg" alt="Caucasian female swinging head and hear while singing into microphone." width="150" height="150" class="alignleft size-thumbnail wp-image-97" />
[/column]
[column width='8']
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam porta sem malesuada magna mollis euismod. Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum.
[/column]
[/row]
[/section]
[section title='My Accordion Section']
This is the content of the second section
[/section]
[/accordion]

[accordion]
[section title=’My First Accordion Section’]
[row]
[column width=’4′]

[/column]
[column width=’8′]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam porta sem malesuada magna mollis euismod. Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum.
[/column]
[/row]
[/section]
[section title=’My Accordion Section’]
This is the content of the second section
[/section]
[/accordion]