How to Use Accordions for FAQs and Expandable Content

What You’ll Learn

How to add and customize accordion subtemplates to organize content into expandable sections on your page.

Why It Matters

Accordions help you keep pages clean and easy to navigate. They’re perfect for FAQs, policies, and other information-heavy sections where you don’t want to overwhelm visitors with too much content at once.

---

Step-by-Step Instructions

1. Add the Subtemplate Widget

1. Log in and go to the page you want to edit.
2. Drag and drop the Subtemplate widget into the section where you want the columns to appear.

---

2. Select an Accordion Template

1. Under the "Categories" section on the left, select Accordion.
2. Browse the accordion options and choose a style that fits your design.

---

3. Configure Title and Heading Tag

1. On the right side of the subtemplate window, enter a title for your accordion.
2. Select a heading tag (like H2 or H3) to structure your content and improve accessibility.
3. Click the green checkmark button at the bottom right to insert the accordion.

---

4. Add Content to the Accordion

1. Click the accordion title you just added to expand it.
2. Drag other widgets (text, image, video, etc.) into the content area inside the accordion.

---

Troubleshooting Tips

• The accordion isn’t expanding on the live site.

  Double-check that you added content to the accordion and clicked the green checkmark to save. If you have just added an accordion, try refreshing the page.

• Text inside the accordion looks too small or too big.

  You can adjust the heading tag or use the Properties panel to customize the text styling.

---