Accordion Component: Difference between revisions
| Line 13: | Line 13: | ||
== Examples == | == Examples == | ||
{{StorybookComponent|id=components-accordion--accordion|height=650}} | {{StorybookComponent|id=components-accordion--accordion|height=650}} | ||
== Step-by-step Instructions == | == Step-by-step Instructions == | ||
Revision as of 13:17, 14 May 2026
The Accordion component allows you to create collapsible/expandable sections of content on your site.
Elements
- Accordion Component - Title
- Toggle Show Title to set the visibility of the component title.
- Accordion Item - Title
- Toggle Initial State to set the accordion item to ‘open’ or ‘closed’ on page load.
- Set Order value to rearrange display order of individual accordion items
- Accordion Item - Content
Examples
Step-by-step Instructions
- Add a Title for the accordion component. Toggle Show Title to set the visibility of the component title.
- Add an Accordion Item to the component:
- Add a Title.
- Toggle Initial State to set the item to display as open or closed on page load.
- Add text to the Content field, which will populate the main body of the accordion item.
- Optionally, set an Order value to rearrange the display order of the accordion item. The lower the value, the higher up it will appear in the display order.
- Add as many additional items as needed by clicking Add Accordion Item.
