The Accordion component features expandable content areas, where clicking on the title of each block expands the content area associated with that block. This is helpful when you have a larger amount of content but want to allow visitors to read through it one particular block at a time.
To get started, open your site in the website editor, click Add Content, and drag the Accordion component to the page. Next, click on the component to open the options panel on the side of the editor.
Managing Blocks
By default the component will have one block of content. To add more, click the Add button. If you want to change the order, click on the three vertical dots for a block and drag it to a new position in the list. To delete a block, click on the red X button for the block. Note that this will also delete the content contained within that block.
Editing Block Content
To edit the title of a block, simply click on the title within the component and type. All of the usual text-formatting options are available to you. Clicking on the title also expands and collapses the block. There are a few different ways to add content to the block:
- Click on the block within the options panel list, then click the Add Content button and select a component to add.
- Click on the Click to Add Content button within the block after expanding it. Note that once you’ve added a component this button is no longer shown.
- Expand a block in the component, then drag a component in from the page itself.
- Expand a block in the component, then click Add Content at the top of the website editor and drag in a component from the list on the left.
Margin
The Margin option controls how much space there is around the accordion within the component. You can set this individually for each side, and can also set it separately for different screen sizes by clicking the desktop/mobile icon.