Accordion sections are commonly used around the web. If you are constrained by the space accordion is a great solution, as you can see in some portfolio items we have used them to make the look of the page more appealing. Accordions are mostly used for FAQ sections. Like all of Blaszok’s shortcodes this one is also available through VisualComposer, which offers a simple drag & drop interface to build complex pages with ease.
First Accordion Opened by Default
Accordion Title 1
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam quis leo at mauris faucibus suscipit. Sed orci arcu, tincidunt at commodo in, consectetur sed enim. Vestibulum aliquet justo rutrum magna tincidunt fringilla. In eget nisl in justo mattis accumsan eu nec magna.
Accordion Title 2
Pellentesque pellentesque pharetra lacus, eget aliquet mi mattis eu. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam ut mi in dui consectetur egestas eget vitae odio. Morbi ut ligula arcu. Nullam eleifend nisl facilisis turpis luctus a bibendum nisl vulputate. Cras feugiat leo a nulla aliquet vitae auctor odio egestas. Phasellus iaculis posuere velit, congue placerat dui rhoncus vel.
Accordion Title 3
Maecenas tortor orci, aliquet et fringilla a, tristique vitae metus. Nunc dignissim varius ante, eget pellentesque felis congue ac. Donec placerat adipiscing sapien id consequat. Donec nec auctor nisl. Curabitur hendrerit ultricies ligula ac blandit. Praesent non vulputate turpis. In est nibh, fermentum eget malesuada ut, ultrices ac lacus.
All accordions collapsed by default
Accordion Title 1
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam quis leo at mauris faucibus suscipit. Sed orci arcu, tincidunt at commodo in, consectetur sed enim. Vestibulum aliquet justo rutrum magna tincidunt fringilla. In eget nisl in justo mattis accumsan eu nec magna.
Accordion Title 2
Pellentesque pellentesque pharetra lacus, eget aliquet mi mattis eu. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam ut mi in dui consectetur egestas eget vitae odio. Morbi ut ligula arcu. Nullam eleifend nisl facilisis turpis luctus a bibendum nisl vulputate. Cras feugiat leo a nulla aliquet vitae auctor odio egestas. Phasellus iaculis posuere velit, congue placerat dui rhoncus vel.
Accordion Title 3
Maecenas tortor orci, aliquet et fringilla a, tristique vitae metus. Nunc dignissim varius ante, eget pellentesque felis congue ac. Donec placerat adipiscing sapien id consequat. Donec nec auctor nisl. Curabitur hendrerit ultricies ligula ac blandit. Praesent non vulputate turpis. In est nibh, fermentum eget malesuada ut, ultrices ac lacus.
Shortcode Attributes
Accordion Attributes:
- title – set widgets title.
- active tab – specifies open tab (optionally all tabs can be closed).
- allow collapsible all – specifies if collapsing all tabs is possible.
- extra class name – add special class to your accordion section for use in CSS.
Accordion Item Attributes:
- title – specifies accordion title.
- content – inside the accordion can be added any other shortcode.