Accordion Pro Demo

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean imperdiet. Etiam ultricies nisi vel augue. Curabitur ullamcorper ultricies nisi. Nam eget dui. Etiam rhoncus. Maecenas tempus, tellus eget condimentum rhoncus, sem quam semper libero, sit amet adipiscing sem neque sed ipsum. Nam quam nunc, blandit vel, luctus pulvinar,


Accordion minimal

 

Lorem ipsum dolor amet

Praesent eget lorem vitae mauris interdum luctus convallis a nunc. Phasellus dictum placerat volutpat. Cras facilisis quam lacus, molestie bibendum nisi egestas nec. Quisque vitae velit posuere, faucibus libero a, posuere felis. Nullam sit amet ornare lectus. Etiam adipiscing elit viverra, tincidunt orci consequat, lacinia erat.

 

Lorem ipsum dolor amet

Praesent eget lorem vitae mauris interdum luctus convallis a nunc. Phasellus dictum placerat volutpat. Cras facilisis quam lacus, molestie bibendum nisi egestas nec. Quisque vitae velit posuere, faucibus libero a, posuere felis. Nullam sit amet ornare lectus. Etiam adipiscing elit viverra, tincidunt orci consequat, lacinia erat.

 

Lorem ipsum dolor amet

Praesent eget lorem vitae mauris interdum luctus convallis a nunc. Phasellus dictum placerat volutpat. Cras facilisis quam lacus, molestie bibendum nisi egestas nec. Quisque vitae velit posuere, faucibus libero a, posuere felis. Nullam sit amet ornare lectus. Etiam adipiscing elit viverra, tincidunt orci consequat, lacinia erat.

Accordion with background

 

Lorem ipsum dolor amet

Praesent eget lorem vitae mauris interdum luctus convallis a nunc. Phasellus dictum placerat volutpat. Cras facilisis quam lacus, molestie bibendum nisi egestas nec. Quisque vitae velit posuere, faucibus libero a, posuere felis. Nullam sit amet ornare lectus. Etiam adipiscing elit viverra, tincidunt orci consequat, lacinia erat.

 

Lorem ipsum dolor amet

Praesent eget lorem vitae mauris interdum luctus convallis a nunc. Phasellus dictum placerat volutpat. Cras facilisis quam lacus, molestie bibendum nisi egestas nec. Quisque vitae velit posuere, faucibus libero a, posuere felis. Nullam sit amet ornare lectus. Etiam adipiscing elit viverra, tincidunt orci consequat, lacinia erat.

 

Lorem ipsum dolor amet

Praesent eget lorem vitae mauris interdum luctus convallis a nunc. Phasellus dictum placerat volutpat. Cras facilisis quam lacus, molestie bibendum nisi egestas nec. Quisque vitae velit posuere, faucibus libero a, posuere felis. Nullam sit amet ornare lectus. Etiam adipiscing elit viverra, tincidunt orci consequat, lacinia erat.

Accordion with dividers

 

Lorem ipsum dolor amet

Praesent eget lorem vitae mauris interdum luctus convallis a nunc. Phasellus dictum placerat volutpat. Cras facilisis quam lacus, molestie bibendum nisi egestas nec. Quisque vitae velit posuere, faucibus libero a, posuere felis. Nullam sit amet ornare lectus. Etiam adipiscing elit viverra, tincidunt orci consequat, lacinia erat.

 

Lorem ipsum dolor amet

Praesent eget lorem vitae mauris interdum luctus convallis a nunc. Phasellus dictum placerat volutpat. Cras facilisis quam lacus, molestie bibendum nisi egestas nec. Quisque vitae velit posuere, faucibus libero a, posuere felis. Nullam sit amet ornare lectus. Etiam adipiscing elit viverra, tincidunt orci consequat, lacinia erat.

 

Lorem ipsum dolor amet

Praesent eget lorem vitae mauris interdum luctus convallis a nunc. Phasellus dictum placerat volutpat. Cras facilisis quam lacus, molestie bibendum nisi egestas nec. Quisque vitae velit posuere, faucibus libero a, posuere felis. Nullam sit amet ornare lectus. Etiam adipiscing elit viverra, tincidunt orci consequat, lacinia erat.



Accordion Pro

Accordion Pro

Developed by fabianbitter.
Beginner Beginner
Certainly the easiest and most versatile accordion add-on out there. jneundorf

Facts in short:

  • Compatible with version 5.7 and 8+
  • Accordion Block Element
  • Easy to customize
  • You can create and assign global style presets
  • Each style preset contains over 60 variables
  • Change all colors, text styles, icons, aligns, paddings etc.
  • The "Designer Favorite" UI component
  • Easy manage the items by Drag & Drop + WYSIWYG
  • Works on all modern browsers and devices
  • Fully Responsive
  • Multilingual

Watch the video to see the add-on in action!

Take a look at the live demo to test the frontend.

You want to save space on your website? With this concrete5 extension you can create an add accordion element for your website in order to shrink your content size.

Unlike other accordion solutions this add-on is fully customizable. You can add an infinite number of pre-set styles to customize your website. Each pre-set style consists of more than 60 adjustable CSS style settings. You can use them for changing colours, text styles, icons, the alignment or padding of icons. The pre-set styles offer you the freedom to create your personalized website. Once a pre-set style is created you can link it to your accordions and reuse them as often as you like. This add-on comes in a packet with three amazing pre-installed pre-set styles.

The content of the accordion items can be easily edited with the aid of the WYSIWYG-function. You can add an unlimited number of items to each accordion. The sort order of the items can easily be changed by drag & drop.

For best SEO results, you can also specify which HTML-tag you want to use for the titles. Moreover, you can set the duration of the slide animation and decide whether the accordion elements are allowed to open multiple items at once or just a single one. The generated markup is valid, fully responsive and will work on all common devices and modern browsers.

The add-on is fully translatable and available in German and English. You will love it!

Notes: For best cross-browser timing experience this add-on makes use of the animation frames technology. Therefore, the duration of the slide animation time can be changed.

Have you already seen my other add-ons? Click here for more information.

See more of my addons

Current Version: 1.1.1
Fully Translatable: Yes
Needs External Libraries: No
Compatible: 5.7.0.4+
License: Standard
Support Response: Replies to tickets every few days.
Support Hosted: At External Website
Needs extra server permissions: No
Needs Internet: No
Marketplace Tests:
Passed Automated Tests
Passed PRB Review