Accordion Feature

How to use the "Accordion" feature to collapse and expand text. 

The accordion feature is a useful format to collapse text into sections whereby the reader can click on a heading thereby triggering it to expand and reveal the text within that topic.

It's easy for the reader to scan the headings and then easily select which information is applicable instead of having to read through the lot - see an example below showing how the accordion feature typically presents on a web page.

When a reader selects a heading the section expands to reveal the contents as pictured below.

Creating this format

To use the accordion feature on your web page. Start by marking up the formatting the way you want it. Adding headings, dot points and standard text paragraphs.

Select the entire area that you want to included in this style of formatting and then from the bottom row of tools in the dashboard select "Accordion" from the bottom of the right hand formatting dropdown menu as shown below.

You will then see a green dotted line, a green shaded background and a label saying "Article Accordion" appear to show the  selection.

Designate the "trigger" headings

Place your cursor alongside each heading that you want to become an Accordion section headers. Designate each point as a "Header" using the same Paragraph menu that you used to apply the "Accordion" setting.

The resulting page mark-up will appear much like this example below.