Accordions

Effectively organize your content

[accordion sync="true"]

Quisque volutpat mattis eros. Nullam malesuada erat ut turpis. Suspendisse urna nibh, viverra non, semper suscipit, posuere a, pede. Sed pretium, ligula sollicitudin laoreet viverra, tortor libero sodales leo, eget blandit nunc tortor eu nibh.

Sed egestas ante et vulputate

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo.

Morbi interdum mollis sapien

Phasellus lacinia, magna a ullamcorper laoreet, lectus arcu pulvinar risus, vitae facilisis libero dolor a purus. Sed vel lacus. Mauris nibh felis, adipiscing varius, adipiscing in, lacinia vel, tellus. Suspendisse ac urna.

Fusce accumsan mollis eros

Ut scelerisque hendrerit tellus. Integer sagittis. Vivamus a mauris eget arcu gravida tristique. Nunc iaculis mi in ante. Vivamus imperdiet nibh feugiat est. Nunc sem lacus, accumsan quis, faucibus non, congue vel.

[/accordion]

Get The Code

[[accordion sync="true"]

<div class="accordion-group"><div class="accordion-heading"><a class="accordion-toggle " data-toggle="collapse" data-parent="#" href="#accordion_item_6829bd61c7582" ><i class="toggle-icon icon-chevron-down"></i><span>Item #1</span></a></div><div id="accordion_item_6829bd61c7582" class="accordion-body collapse in"><div class="accordion-inner" >
Content...
</div></div></div>

<div class="accordion-group"><div class="accordion-heading"><a class="accordion-toggle closed" data-toggle="collapse" data-parent="#" href="#accordion_item_6829bd61c758d" ><i class="toggle-icon icon-chevron-down"></i><span>Item #2</span></a></div><div id="accordion_item_6829bd61c758d" class="accordion-body collapse "><div class="accordion-inner" >
Content...
</div></div></div>

[/accordion]]

Customization Options

sync – whether to keep only one item open at a time
title – the title of the accordion item
open – whether it's open by default on page load
color – the background color of the accordion item
border – the border color of the accordion item