Accordion

Accordion short codes (updated 3/28/14)^[1]

Use:

[accordion]
[item title="title1"] tab content [/item]
[item title="title2"] another content tab [/item]
[/accordion]

In the editor drop-down selector, "Accordion group" and "Accordion item" are under category "layout"

"Accordion group" puts in the [accordion][/accordion] tags

"Accordion item" puts in the [item title="title1"] tab content [/item] content

You can embed more than one group per page, but they cannot be nested.

Unfortunately, any "<br />" tags added by the editor are included in the output code.... This is a WordPress thing that I don’t (yet) know how to avoid.

Generated Code:

<div>

<h7><a href="" id="Panel 1">Panel 1</a></h7>

<div>Pellentesque fermentum dolor. Aliquam quam lectus, facilisis auctor, ultrices ut, elementum vulputate, nunc.</div>

<h7><a href="" id="Panel 2">Panel 2</a></h7>

<div>Donec nec justo eget felis facilisis fermentum. Aliquam porttitor mauris sit amet orci. Aenean dignissim pellentesque felis.</div>

<h7><a href="" id="Panel 3">Panel 3</a></h7>

<div>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus hendrerit. Pellentesque aliquet nibh nec urna. In nisi neque, aliquet vel, dapibus id, mattis vel, nisi. Sed pretium, ligula sollicitudin laoreet viverra, tortor libero sodales leo, eget blandit nunc tortor eu nibh. Nullam mollis. Ut justo. Suspendisse potenti.</div>

</div>

Style Sheet:

.accordions { }

h7.accordion { }

div.accordion { }

Also adds a JavaScript that calls jQuery to do the heavy lifting!