The Accordion Element allows you to create expandable sections of your content. These are great for creating pages such as FAQs or similar.
How to Use The Accordion Element
To get started with the Accordion Element, simply drag an Accordion Element onto your page.
To add a new pane to your Accordion, simply use the 'add new pane' option in the right-hand menu of the editor.
Configuring Your Accordion Elements
There are a bunch of options that come with the Accordion Element.
By default, only one pane of the accordion can be opened at any one time. This can be changed by disabling the only one pane open option in the sidebar.
Icon allows you to change the icon that is shown on the accordion section. There are currently three options: chevron, none or plus.
Text Alignment determines the justification of the titles of the panes. You can choose to right, left or center justify your titles.
Font allows you to change the font and the font size of your pane headings. The Accordion Element uses the Google Fonts API to pull in fonts to choose from.
Styling Your Accordion
The Accordion Element offers a range of customization options that can help you make your page the way that you like it. This includes a range of color options for your Accordion.
How can I change my accordion heading classes?
By default Shogun's accordion headings leverage the H4 CSS from your theme, however, you can prompt the text to pick up alternative stylings from your theme's header classes by adding the relevant tags around the text as illustrated.