Accordion Enhancement

Make the contents of a Widget collapsable with the Accordion Enhancement. Use this to reduce clutter and information overload that can occur on information-dense pages by presenting content based on the user's need. Widgets with this enhancement display as buttons with their title as the button's label. Users can click them to either show or hide the contents of the widget.

Note: The Accordion Enhancement is available to all digital workplaces. Contact the Igloo Support Team if you experience any issues applying this style.

Example of the Accordion Enhancement on a Blog Articles Widget

Considerations and caveats

Keep in mind the following when adding the Accordion Enhancement to a Widget:

• You must put a title on Widgets that use the Accordion Enhancement, but do not enable title links.
• Do not put the Accordion Enhancement on an RSS Feed Widget.
• Do not use the Accordion Enhancement on the Links Widget. The Links Widget provides its own accordion functionality.
• Do not use the Widget Tabs Enhancement in combination with the Accordion Enhancement.

How to create an accordion

Apply the Accordion Enhancement to a Widget by giving it the accordion class. Refer to the article Applying custom CSS to widgets if you are unsure of how to apply CSS classes to a Widget. After adding this class to a widget, go to it's Options tab and enter a title for the widget. This title will act as the label for the button.

If you would like to have a title appear above your accordion, place an HTML Widget above it. Then, add the accordion-title class to it, and enter your title into the HTML Widget's title field.