Basics
Description
An accordion block is a header that when clicked by the user, reveals hidden 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.
Modify
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.
The accordion block is very versatile and can be added to query
, repeater
and taxonomy terms
blocks.
Header and Content
By default, the accordion block comes with an accordion headerblock (containing a heading)and
an accordion 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.
Add
Select a block that can receive an accordion block.
Click the "+" icon in the Quick Inserter.
Search for the accordion block
Click the accordion icon to insert an accordion block into your parent block.
You will now see that the Accordion block has been inserted and is made up of the Accordion Header and Accordion Content block.
Last updated