Collapsible accordions in the Editor
The key benefits to the accordion block versus creating an accordion with HTML are that there is no need for JavaScript to expand / collapse the block, and Ctrl+F works on collapsed text.
Add a collapsible accordion
In the Editor toolbar, click Elements, then click Accordion. This will insert the accordion block.
Accordion components
The accordion block includes a summary and body sections. The summary will always be displayed, even when the accordion is closed or collapsed. Once the accordion is expanded, the body will also be visible.
Near the accordion block will be the option to expand / collapse the accordion, and a delete (garbage can icon) option.
Visual marker
The visual marker shows whether the accordion is expanded or collapsed. By default, on page load, accordions are collapsed.
By default, the marker is a triangle which points tot he right or down when the accordion is collapsed or expanded, respectively. The marker can be customized with CSS if you prefer a different symbol.
- When collapsed, the triangle marker points to the right.
- When expanded, the triangle marker points down.