Accordions
Accordians - No Background Section
Heading Level 3
Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Sed pellentesque ornare nibh. Maecenas dui metus, accumsan a consectetur at, gravida id orci. Sed viverra nisl in viverra accumsan. Quisque fringilla, leo quis gravida bibendum, lacus tortor feugiat lacus, vitae tempus erat enim id diam. Phasellus vel sapien ut purus malesuada ullamcorper. Vivamus congue posuere ligula, sed congue nisi vestibulum non. Nam id pharetra odio. Curabitur arcu neque, mattis et est vel, elementum vulputate mi. Phasellus interdum sapien a sagittis elementum. Maecenas dignissim sit amet lectus et venenatis.
Coffee is great!
| Name | Pet Name | Type of Animal |
|---|---|---|
| John | Rover | Hedgehog |
| Jane | Dame Agatha Whisperlantern upon Avon | Skink |
Accordion - Dark Section
Heading Level 3
Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Sed pellentesque ornare nibh. Maecenas dui metus, accumsan a consectetur at, gravida id orci. Sed viverra nisl in viverra accumsan. Quisque fringilla, leo quis gravida bibendum, lacus tortor feugiat lacus, vitae tempus erat enim id diam. Phasellus vel sapien ut purus malesuada ullamcorper. Vivamus congue posuere ligula, sed congue nisi vestibulum non. Nam id pharetra odio. Curabitur arcu neque, mattis et est vel, elementum vulputate mi. Phasellus interdum sapien a sagittis elementum. Maecenas dignissim sit amet lectus et venenatis.
Coffee is great!
| Name | Pet Name | Type of Animal |
|---|---|---|
| John | Rover | Hedgehog |
| Jane | Dame Agatha Whisperlantern upon Avon | Skink |
Accordion - Light Section
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
How do I...
What is an Accordion?
Accordion is a layout builder block with a navigation bar, which contains the heading and the body, which contains text. When the navigation bar is clicked, the body text will 'open' and appear.
How do I create an Accordion?
- In Layout Builder, add a block.
- A tray slides in from the right displaying options, select Accordion
- Add the Title (Display title optional, uncheck to hide title)
Accordion Type
- Collapse closes an open accordion item when another item is opened.
- Open makes accordion items stay open when another item is opened.
- Accordion items Heading
Select the HTML tag for the heading
- Add an Accordion Item
- Add Heading
- Add Body
If you want another Accordion item select Add Accordion Items
- Select Add Block