In this Article
The Accordion element lets you create a series of "panels" that can be hidden or shown by the end user. Each of these panels can be configured to display custom content and expanded or collapsed as a way of targeting a specific block of content displaying in a particular panel.
Insert an Accordion element by going to the Layout tab in your Element library.
Customize your Accordion element
The element is initially created with one panel. Click the green “Add Panel” link to add more panels.
Hover over each panel to access the settings gear where you can change the title for that panel, as well as drag to reorder panels or delete if no longer needed.
For more information about using Accordion elements, refer to Customize an Accordion or Tabs element.
Panel Group element settings
The Panel Group element settings can be accessed by clicking on the element settings gear in the top right corner.
The Panel Group element settings includes the following configuration options:
- Accordion OR Tabs Format: Choose "TABS" format to change to a Tabs element where panels will display horizontally instead of vertically as they display in an Accordion element.
- Title: Change or toggle off to remove the Title over the entire panel group.
- Expand first panel by default: When selected, the first panel of the accordion will be expanded when the page is loaded. If this checkbox is left unselected, all accordion panels will be closed when the page loads.
- Expand only one panel at a time: Panels will automatically close themselves if another panel is clicked when this checkbox is selected. When unselected, the user will have to manually close each panel.
- Show Expand/Collapse Icon: Display an arrow icon before or after the title, or select “None” to not show the icon.
Comments
Please add how to REORDER accordion panels. It should be intuitive but when I use the arrows icon it's moving the whole accoridon and not the individual panels.
Heather, you can learn about how to reorder accordion panels by going to: https://www.finalsitesupport.com/hc/en-us/articles/115001112491-Customize-an-Accordion-or-Tabs-element and clicking on "Reorder panels" at the top.
Please Sign in to leave a comment if you don't see the comment box below.