Headings, displayed vertically and stacked, that expand to reveal panels containing rich text content. Visitors can click the headings to show or hide a panel’s content.
No, this function is not supported using the Accordion.
No, images are not supported in the heading.
Note: the Accordion component was rebuilt in the fall of 2024 resulting in some changes in how they are constructed. Any accordions built before this change will still work using the instructions for the previous version (see "Add Accordion Tabs to an Accordion Component," below).
In Page Builder:
Alternate method:
If this is new Accordion content:
If using existing Accordion Data (content):
The Accordion Tab and toolbar are displayed.
In Page Builder:
Drag an Accordion Tab component to the Accordion container to add an additional tab to the Accordion.
If this is new Accordion content:
If using an existing Accordion content data source:
To move Accordion Tabs:
Select an Accordion Tab.
Click on the Move up or Move down arrow icons.
Alternate method: click and hold on the 10-dot handle on the component toolbar and move the Accordion Tab to the desired location in the Accordion container.
Instructions for previous iteration of Accordion:
In Page Builder:
Initially, an Accordion panel appears without a title. The content area contains a “+” button.
In Page Builder:
Alternate method: Click Components tab at the top of the content tree. Drag a component into the Accordion panel placeholder box.
To assign a new component data source to an Accordion component:
To assign an existing data source to an Accordion component:
Repeat as necessary to add all panels to the Accordion and to add content to all panels. Follow the instructions for specific components being added to panels.
Click the Explorer icon.
Locate and click the panel to select it.
To edit an existing panel:
To create a new content type in a panel:
When done with content authoring activities:
Page Builder | Explorer | Content Editor | |
Add component | Optimal | ||
Add panels | Optimal | Possible | Possible |
Rename panels | Optimal | Possible | Possible |
Delete panels | Optimal | Possible | Possible |
Copy panels | Optimal | Possible | Possible |
Reorder panels | Optimal | Possible | Possible |
Add content to panel* | Optimal | Possible | Possible |
*Add content type and then follow component-specific instructions
Documentation updated: Feb. 7, 2025
Image Properties: Click Properties link above the image to open a dialog box to change image properties and to add or change the Alt Text field.