How to Use & Customize Accordion Widget

The Accordion Widget is used to display text in a condensed, example you can use accordion for FAQ in your website.

Follow the step-by-step instructions:

1. Go to Menu Romethemekit.

2. And you will be able to see the Accordion Widget.

3. Click Add New Container.

4. Select your layout : Flexbox or Grid.

5. On the canvas select your structure.

6. Drag the widget from the Elementor.

7. Drop it on the selected area.

8. Setting Content :

• Click Content → Accordion.
• Setting your content here.
• Click Add Item to add the content.

9. Setting Icon :

• Click Content → Icon.
• Select your icon and icon position here.
• Click Icon Library → Choose Icon → Click Insert.

10. Accordion Style (used to customize the accordion style) :

• Click Style → Accordion.
• Customize the spacing here.

11. Title Style (used to customize the title style) :

• Click Style → Title.
• Customize the alignment, padding, typography, radius, text and background color, border type, border width and border color.

12. Icon Style (used to customize the icon style) :

• Click Style → Icon.
• Customize the size, box width, height, margin, radius, icon color, box shadow, background color, and border.

13. Content Style (used to customize the content style) :

• Click Style → Content.
• Customize the alignment, typography, padding, radius, text color, text shadow, background and border type.

14. Don’t forget to click Publish to save the changes.