Accordion

Ensemble ships with a responsive accordion plugin that that lets you store content away in smart dropdown sections. Depending on the theme you have purchased your accordion may have several styles available to it, please check the individual themes docs for more info.

Accordion

The accordion follows a simple HTML structure of an outer accordion class, with a header that has the class accordion__header and finally a div to store your content with a class of accordion__content.

<div class="accordion">
	<header class="accordion__header">Accordion 1</header>
		<div class="accordion__content">
			
		</div>
	<header class="accordion__header">Accordion 2</header>
		<div class="accordion__content">
			
		</div>
	<header class="accordion__header">Accordion 3</header>
		<div class="accordion__content">
			
		</div>
	<header class="accordion__header">Accordion 4</header>
		<div class="accordion__content">
			
		</div>
</div>

Javascript options

The Ensemble accordion has one option that can be set in the javascript file js under the section Accordion, this option dictates if the first content area is open when the page first loads, it can take a true or false argument.

$('.accordion').ensembleAccordion({
	beginOpen: 'false'
});