Accordion
An
accordion
block is a header that when clicked by the user, reveals associated content.
→
The
accordion
block is usually used to display "text heavy" content such as FAQs (frequently asked questions) or to manage the display of different content in your page without crowding the user's viewpoint.You can modify and personalise the appearance of your
accordion
block using the properties in the primary tab: settings, colours, layout, typography, margins and padding.
By default, the
accordion
block comes with an accordion header
block (containing a heading)and
anaccordion content
block (containing a paragraph) so you can visually see the accordion
block in the editor. The
heading
block and the paragraph
block can be replaced by any other block.If you click on the accordion heading, the content appears in the editor.
The
accordion
Settings tab is where the accordion properties are listed, such as whether the accordion should be open or closed on the front end, whether it is linked to an accordion
block and the transition duration.The Colours property allows you to personalise the Text, Link and Background colours of your
accordion
block.The Layout determines the way your
accordion
block is set out including: flex properties and direction.The Typography property allows you to format and customise your text, and so determines the style and appearance of the written content in your
accordion
block.The Margin and Padding property allows you to specify the space inside and outside an element; the Margin property controls the space outside an element, and the Padding property controls the space inside an element.
Last modified 6mo ago