Zentools Accordion

Overview

The accordion layout is a simple collapsible accordion that uses the title of your item as the trigger to open or close the accordion. The accordion can use content from K2, Joomla or images populated from a directory.

Features

  • Each item is rendered underneath the next one in a vertical list.
  • Create layouts that include up to four columns.
  • Use the title or category as the first item to trigger the accordion.
  • Select whether to load the accordion with the first item open. 
  • Determine whether to position the icon to the left or the right of the title
  • Select from a number of different icon types to set next to the title.

Demonstration

Accordion default

The default styling for the accordion.

As I get older, I find that wearing bright colors cheers me up

Only when human sorrows are turned into a toy with glaring colors will baby people become interested - for a while at least. The people are a very fickle baby that must have new toys every day.

I have had every hair color. I joke with my hair colorist because it is great

I don't like mixed colors that much, like plum color or deep, they are hard to define. She keeps sheets of paper on every hair color that I've had, so she has records of it all. She's done my hair since I was 15, and I guess I have a thick folder going because I've had so many different hair colors.

Austrailian beaches - enjoy the scenery

If that's the color green or orange, they do that with their clothes. As I've grown older, everything reversed. My music, my personality - onstage those things became my colors

A beautiful night in Sydney

Each character's point-of-view is a different color. The text of the manuscript is color-coded the same way. The last thing I do before submitting the manuscript is turn all those colors back to black

 

Accordion Boxed

A subtle box styling for the accordion.

As I get older, I find that wearing bright colors cheers me up

Only when human sorrows are turned into a toy with glaring colors will baby people become interested - for a while at least. The people are a very fickle baby that must have new toys every day.

I have had every hair color. I joke with my hair colorist because it is great

I don't like mixed colors that much, like plum color or deep, they are hard to define. She keeps sheets of paper on every hair color that I've had, so she has records of it all. She's done my hair since I was 15, and I guess I have a thick folder going because I've had so many different hair colors.

Austrailian beaches - enjoy the scenery

If that's the color green or orange, they do that with their clothes. As I've grown older, everything reversed. My music, my personality - onstage those things became my colors

A beautiful night in Sydney

Each character's point-of-view is a different color. The text of the manuscript is color-coded the same way. The last thing I do before submitting the manuscript is turn all those colors back to black

 

Accordion Icons

Select from a vast array of icons to use for your open / close icon.

As I get older, I find that wearing bright colors cheers me up

Only when human sorrows are turned into a toy with glaring colors will baby people become interested - for a while at least. The people are a very fickle baby that must have new toys every day.

I have had every hair color. I joke with my hair colorist because it is great

I don't like mixed colors that much, like plum color or deep, they are hard to define. She keeps sheets of paper on every hair color that I've had, so she has records of it all. She's done my hair since I was 15, and I guess I have a thick folder going because I've had so many different hair colors.

Austrailian beaches - enjoy the scenery

If that's the color green or orange, they do that with their clothes. As I've grown older, everything reversed. My music, my personality - onstage those things became my colors

A beautiful night in Sydney

Each character's point-of-view is a different color. The text of the manuscript is color-coded the same way. The last thing I do before submitting the manuscript is turn all those colors back to black