Accordion
How to Build This Module
To insert an accordion into a page, click the Add Element button in Visual Composer and select the content type Accordion. The Accordion is a single-use content type, but you can create a reusable accordion with the reusable Visual Composer Module.
The Accordion is essentially a container of content sections. To enter content in a section, expand the section in Visual Composer to display the section toolbar. The Accordion container has its own properties for controlling the open panel and collapsed/expand state on page load. You can also enter a display title for the accordion. Each section has a single property: the section title.
Once you insert an accordion, you can maintain a variety of content in each accordion section using the standard Visual Composer tools for managing content. You can also use the drag-and-drop handles to change the order of sections.
Tip: If you insert a Text-Box Module or List Module into an accordion section and do not want to display titles for both the section and the module, check Hide Title in the module’s Settings form.
- Link to expand first section
- Link to expand second section
- Link to expand third section
- Link to expand fourth section
- Link to expand fifth section
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In facilisis adipiscing sem quis sodales. Vestibulum fermentum placerat nibh sed bibendum. Mauris sit amet facilisis magna, at gravida tellus. Aenean vulputate ipsum facilisis mauris mattis tempus. Ut lacinia pellentesque risus ut convallis. Sed varius dolor vel nunc vestibulum fermentum. Praesent lacinia sapien sit amet sapien consectetur, nec cursus augue venenatis. Nullam felis nisi, vulputate ut eleifend eget, vestibulum sed urna. Donec tortor tortor, porttitor nec convallis eget, mattis in ante. Proin vel hendrerit libero. Cras commodo massa pulvinar ante tempus suscipit a vitae nisl. Morbi vitae scelerisque ligula. Integer dictum, libero vel tristique pharetra, risus metus ultrices ipsum, et mollis nisi diam varius dui. Nam aliquet pharetra velit, eu elementum lorem cursus non. Fusce non metus vel turpis commodo sollicitudin.
Section 1
Mauris External Link mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer ut neque. Vivamus External Media [PDF – 98.6KB] nisi metus, molestie vel, gravida in, condimentum sit amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut odio. Curabitur PDF [84K] malesuada. Vestibulum a velit eu ante scelerisque vulputate.
Section 2
Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In suscipit faucibus urna.
Section 3
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur efficitur, magna a maximus efficitur, dolor tortor sodales nisl, id rhoncus felis tellus vel ante. Nulla sit amet tellus ligula. Nunc eleifend vehicula bibendum. Nulla facilisi. Ut commodo finibus placerat. Etiam malesuada nibh vel turpis vestibulum iaculis. Quisque est urna, varius volutpat sapien at, fringilla tempor lorem. In gravida fringilla massa quis lacinia. Morbi et tincidunt velit. Vestibulum nec enim hendrerit, consequat tortor sed, venenatis neque. Etiam lacinia fringilla lacus, eu ultricies neque lacinia sit amet. Quisque mattis ante ultricies tristique luctus. Curabitur erat velit, cursus a pellentesque quis, sagittis at lorem.
Sed faucibus urna vitae molestie efficitur. Aliquam erat volutpat. Sed vel massa magna. Sed erat dui, sagittis eget egestas ac, pharetra in odio. Sed commodo ligula sed feugiat pulvinar. Vestibulum rutrum lacinia consequat. Vestibulum et leo ornare, efficitur mauris eu, commodo est. Quisque ut laoreet ligula. Sed ac laoreet ante, non facilisis nibh. Ut at risus a nisl auctor fringilla. Aenean nulla mauris, tincidunt quis neque ut, congue consectetur ligula. Praesent pulvinar pretium sodales. Maecenas ultricies vehicula cursus. Etiam mattis turpis vitae odio rutrum venenatis id vitae odio. Aliquam sollicitudin nec velit malesuada rhoncus. Quisque finibus velit sed est dignissim, nec congue odio scelerisque.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam elementum quam nibh, quis commodo purus auctor sed. Curabitur at malesuada mi, eget fringilla mauris. Sed sed ligula tellus. Ut ac imperdiet lacus. Morbi venenatis porta arcu, in luctus urna porttitor quis. Morbi mattis sollicitudin sapien in pellentesque. Sed sollicitudin ante ut elit ullamcorper, in rutrum tortor iaculis.
Section 4
Section 5
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur efficitur, magna a maximus efficitur, dolor tortor sodales nisl, id rhoncus felis tellus vel ante. Nulla sit amet tellus ligula. Nunc eleifend vehicula bibendum. Nulla facilisi. Ut commodo finibus placerat. Etiam malesuada nibh vel turpis vestibulum iaculis. Quisque est urna, varius volutpat sapien at, fringilla tempor lorem. In gravida fringilla massa quis lacinia. Morbi et tincidunt velit. Vestibulum nec enim hendrerit, consequat tortor sed, venenatis neque. Etiam lacinia fringilla lacus, eu ultricies neque lacinia sit amet. Quisque mattis ante ultricies tristique luctus. Curabitur erat velit, cursus a pellentesque quis, sagittis at lorem.
Sed faucibus urna vitae molestie efficitur. Aliquam erat volutpat. Sed vel massa magna. Sed erat dui, sagittis eget egestas ac, pharetra in odio. Sed commodo ligula sed feugiat pulvinar. Vestibulum rutrum lacinia consequat. Vestibulum et leo ornare, efficitur mauris eu, commodo est. Quisque ut laoreet ligula. Sed ac laoreet ante, non facilisis nibh. Ut at risus a nisl auctor fringilla. Aenean nulla mauris, tincidunt quis neque ut, congue consectetur ligula. Praesent pulvinar pretium sodales. Maecenas ultricies vehicula cursus. Etiam mattis turpis vitae odio rutrum venenatis id vitae odio. Aliquam sollicitudin nec velit malesuada rhoncus. Quisque finibus velit sed est dignissim, nec congue odio scelerisque.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam elementum quam nibh, quis commodo purus auctor sed. Curabitur at malesuada mi, eget fringilla mauris. Sed sed ligula tellus. Ut ac imperdiet lacus. Morbi venenatis porta arcu, in luctus urna porttitor quis. Morbi mattis sollicitudin sapien in pellentesque. Sed sollicitudin ante ut elit ullamcorper, in rutrum tortor iaculis.
Section
- Page last reviewed: June 21, 2017
- Page last updated: June 21, 2017
- Content source: