An accordion is a group of collapsible panels containing content and links. They are useful when there is a lot of information that could overwhelm the user if displayed all at once. Accordions can group information into smaller digestible chunks.

Important If your site is in Ektron, please use the Accordion content module rather than copying and pasting this code. See 'Creating accordion content' to learn how to do this.

Do you not change the default background or text colour of panel headings.

Default accordion

Top of page

Link to open accordion item

Instructions for adding a link from an external page so it scrolls to an open accordion item.

Top of page

Old accordion

This version of the accordion has been deprecated and will be discontinued. Please use the default accordion above instead.

Top of page