Use Accordion Components in Cascade

Quick Links: | Guidelines and Best Practices | Accordions in Cascade 3.0 | Accordions in Cascade 4.0 | Fix Common Accordion Issues |

Follow Accordion Guidelines and Best Practices

Requirements and Best Practices

• Accordion item titles should be descriptive for quick scanning
• Do not add headings inside accordion items; use plain paragraph text instead

When to Use an Accordion

• Frequently Asked Questions (FAQs)
• Step-by-step processes
• Content that does not need to be viewed all at once

Add an Accordion in Cascade 3.0

Requirements

• Must be an approved site maintainer
• The accordion must be created as a widget before adding it to a page

Steps

1. Select Add Content.
2. Open the Widgets folder.
3. Select Accordion.
4. Enter a unique name and confirm the placement folder is the widgets folder.
5. Add a title and text for each accordion item.
6. Select the + button to add additional items.
7. Select the options menu and choose Check Content & Submit.
8. Open the page where the accordion will be used.
9. Set the page to complex and choose Widget Block as the content type.
10. Select Choose Block and select your accordion.
11. Submit the page.

Add an Accordion in Cascade 4.0

Requirements

• Minimum of 4 items and maximum of 15 items
• Must be a Content Contributor
• Must have access to the “Chico State” folder
• All accordion item text must be inside a paragraph tag

Steps

1. Locate the page within the “Chico State” folder.
2. Select Edit.
3. Select the + button to add a new group.
4. Select the accordion component from the component menu.
5. Optional: Add a heading and introductory text.
6. Add item labels and text for each accordion item.
7. Ensure each item contains valid paragraph formatting.
8. Optional: Add a call-to-action link or inline links.
9. Select Preview Draft to review formatting.
10. Select Submit to send for approval.

Fix Common Accordion Issues

• My accordion text has incorrect font or color
  Your text likely does not include proper paragraph formatting. Edit the item and ensure the text is within a paragraph.
• My accordion shows ${panel.label}
  This indicates a required field is missing. Check that all items include both a title and text.

 Still need help? Contact Web Services for further assistance.
  
 Help us improve our Knowledge Base! Click Yes or No below, then let us know what worked — or what didn’t. Your feedback helps us improve our content and provide the best possible support.