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 nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Accordions
Accordions allow you to create content that is closed by default and hidden from the user.
Users access the content by clicking or tapping the down arrow.
Think carefully before you chose this component. If you want to use accordions because there is a lot of content on the page, maybe consider splitting it across more than one page instead.
How to add an accordion component
Add a new component and choose accordion.
In the below example:
- 'Test: accordion' (H2) is the title of the entire accordion
- 'Accordion pane 1' (H3) is the title of the first accordion pane
- the content in accordion pane 1 is in the content field and is what is displayed when the pane is opened
- click 'Add accordion pane' at the bottom to add the second pane
- this process then applies for all subsequent panes
Example
Test: accordion
Accordion pane 1
Accordion pane 2
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 nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Accordion pane 3
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 nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.