Skip to main content

Accordion

Overview

This component allows you to add one or more collapsible accordion sections onto the page. This can play an important role in making sure pages aren't visually overwhelming and let visitors choose what information is most relevant to them based on the headings provided. An overarching title and description can also be used to provide context about the accordion sections underneath.

 

When to use Accordions

  • When you have a lot of information to provide to your visitors but don't want to overwhelm them with a 'wall of text', this is a great alternative to creating multiple pages for related content.
  • When the same page has information that applies to different kinds of visitors, using accordions allows them to select which heading contains the information most relevant to them.

 

Tips for best results

  • If a relevant heading and/or description exists, the overarching title and blurb can be used. This should not be confused with the Heading and Body text of a single Accordion item. There is no limit to the number of accordion items that can be included in a single Accordion component.
  • Toggle ‘Close all’ to have all accordions closed otherwise the first one will be remain open by default.
  • There is always a risk that some visitors will miss or ignore the accordions. It's best not to put any critically important information inside them.

 

Image dimensions and considerations

  • This content type can accommodate a wide range of image sizes and orientations. See Working with Images for more information.
  • Images currently can't be aligned the way they can in a WYSIWYG section.
Off
  • Close all checkbox is left toggled off so that the user can see the first group of content.

    Nunc ad placerat dignissim at aptent ullamcorper neque est placerat pulvinar scelerisque lacinia vestibulum tristique cum a parturient egestas parturient odio vel parturient sagittis a primis.Dis gravida. Curae fames orci inceptos a arcu condimentum platea nostra a morbi vestibulum nisl senectus hac ultricies parturient commodo a ad a suspendisse fames lacinia lacus.

    Image