Instructions for adding accordions in the body content section of a page.

Use the Accordion feature to create a scannable step-by-step list or checklist for users. It can also be used to conceal content where a page has a lot of content and the user doesn’t need to see it all at once (for example, General orders page; Annual reports page).

Once the accordion is live, it will show a button for 'Open all' and 'Close all' in the front end.

Screenshot of the Add an accordion section

Create an accordion

Leave the Accordion title field blank.

For the Accordion style you can choose Basic or Numbered. Numbered accordions should only be used for procedural-type instructions where the order of doing things is important.

In the Accordion content section:

  • Click the Add another component button to add another section in the accordion.&

Accordions should have at least 2 pieces of accordion content.

Accordion image dimensions

Landscape image: maximum 818px wide, no more than 496px high

Portrait image: maximum 400px high

Reviewed 13 August 2021

Vic Gov digital guide

Was this page helpful?