Add Expandable/Collapsible Content With an Accordion Module

The Accordion module is used to display content in content boxes which can be toggled open and closed with an accordion effect.

To use the Accordion module:

  • Enter a title for the accordion tab under the "Accordion Title"
  • Enter the text to show within the accordion tab under the "Accordion Text"
  • To delete or duplicate a row: hover over the row menu icon (top left icon of the row)
  • To add a row: just click the "Add new row" button

accordion module preview

  • Module Title This option is used to add the title of your module.
  • Accordion Title The title shown in the accordion heading for each accordion tab.
  • Accordion Text The text shown in the accordion content area for each accordion tab.
  • Default Open/Closed This option determines whether a tab defaults to open or closed.
  • Add New Row This option adds a new row to add more accordion tabs.
  • Accordion Layout This option is used to determine the layout and style of the accordion module and will affect how the tabs are shown.
    • Option 1 This layout will show the tab headings and content as one block.
    • Option 2 This layout will show the tab headings separate from the content in two blocks.
  • Expand / Collapse This option is used to change what will happen when a user clicks on an accordion heading.
    • Toggle When clicking on a tab heading, the selected tab will open and other tabs will still remain open.
    • Accordion When clicking on a tab heading, the selected tab will open and other tabs will be closed.
  • Accordion Color This option is used to change the color of the accordion module.
  • Accordion Appearance These options provide the ability to toggle various effects for the accordion boxes.
    • Rounded Toggles whether the corners of the module's content will be rounded.
    • Gradient Toggles whether the module will have a gradient effect applied to it.
    • Glossy Toggles whether the content area will have a gloss overlay effect applied to it.
    • Embossed Toggles whether the module will have an emboss effect applied to the edges.
    • Shadow Toggles whether the module will have a shadow effect applied to it.
  • Icon Add an icon that'll appear when your accordion is opened or closed.
  • Additional CSS Class This option allows you to add any custom CSS classes you wish to be output with the module.
Submit a request
Join the Discussion

Community browse

Сategory Menu
Powered by Zendesk