Accordion Widget
The Accordion widget displays content inside a list of items that can be expanded and collapsed by clicking each of their headers.
Easy To Use
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.
Theme Support
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.
Fast & Lightweight
Phone
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.
Bike
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.
Plants
Alignment
Media items can be aligned to the top, left or right of the content. Left and right alignment provide more options, like the column width at a specific breakpoint.
Shop
Shop
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
- Item 1
- Item 2
- Item 3
Lifestyle
Lifestyle
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
- Item 1
- Item 2
- Item 3
University
University
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
- Item 1
- Item 2
- Item 3
Brandon Cooper
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Dillan Smith
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Susan McKenzie
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Additional Fields
Some of the elements that you can display inside an Accordion widget need to be defined first by creating an additional field inside the Content Manager.
| Field | Description |
|---|---|
| Social Links | Available social fields are Email, Facebook, Google Plus and Twitter. |
Accordion Options
| Accordion Options | Settings | Description |
|---|---|---|
| Collapse Items | Don’t allow multiple opened items | |
| First Item | First item is opened at start |
| Media Options | Settings | Description |
|---|---|---|
| Media Display | Display the image or video of all items. | |
| Media Image | [Number] | Set the width and height of the image in pixels. |
| Media Alignment | Top, Left, Right | Define the image alignment. |
| Media Border | None, Circle, Rounded | The appearance of the images inside the Accordion. |
| Overlay | None, Link, Icon, Image, Social Buttons | Define what will be displayed inside the overlay or hide the overlay. |
| Overlay Animation | Fade, Slide Top, Slide Bottom, Slide Left, Slide Right | The animation that will be applied to the overlay when being displayed on hover. |
| Overlay Image Animation | None, Fade, Scale, Spin, Grayscale | The animation that will be applied to the image on hover. |
| Content Options | Settings | Description |
|---|---|---|
| Text Display | Show or hide title, content and social buttons. | |
| Text Title Size | Default, H1, H2, H3, H4, Extra Large | Define the font size of the title. |
| Text Alignment | Left, Right, Center | Define the text alignment. |
| Link Display | Display the Read More link. The link URL is added to each item in the Content Manager. | |
| Link Style | Text, Button, Button Primary, Button Large, Button Large Primary | Set the style of the Read More link. |
| Link Text | [Text] | Define the link text. |
| General Options | Settings | Description |
|---|---|---|
| Custom HTML Class | [Text] | Set a custom HTML class that will be added to the widget element in the rendered output. |