Accordion Group
SCB - Accordion Group
Display 1 to 20 Accordions with an optional heading and introduction above them all.
Content Type Details
- ID: 328
- Name: SCB - Accordion Group
- Minimum user level: Contributor
- Compatible with page layouts: SCB - Full Width, SCB - Inner - Full Width, SCB - Inner - with on-page navigation
Guidance
Adds an accordion with optional heading and introduction.
Up to 20 accordion panels can be added.
Each accordion panel has a Title for the closed panel and Description for the open panel.
There is a choice of Dark Blue, Light Blue or Light Grey as the background colour of the closed panel.
Content Type Elements Details
| Name | Description | Size | Type | Required | Conditionally Shown |
|---|---|---|---|---|---|
| Name | The Name Element | 80 Characters | Plain Text | Yes | No |
| Heading | An optional heading to appear above the Accordion group. For example “Frequently asked questions”. | 150 Characters | Plain Text | No | No |
| Introduction | An optional brief description for the group of content | 500 Characters | Plain Text | No | No |
| Accordion Row | Enter the content for each Accordion | N/A | Repeater | Yes | No |
SCB - Repeater - Accordion
For use with the Accordion Group content type. Adds a single Accordion Row.
Content Type Details
- ID: 334
- Name: SCB - Repeater - Accordion
- Minimum user level: Contributor
- Compatible with page layouts: SCB - Full Width, SCB - Inner - Full Width, SCB - Inner - with on-page navigation
Content Type Elements Details
| Name | Description | Size | Type | Required | Conditionally Shown |
|---|---|---|---|---|---|
| Name | The Name Element | 80 Characters | Plain Text | Yes | No |
| Title | Title for example “How do I apply for a course” | 150 Characters | Plain Text | Yes | No |
| Description | Content for the expanded accordion. Supports rich text such as bold, italics. | 99999 Characters | HTML | Yes | No |
| Background color | Choose the background color. Choose from options: Dark Blue, Light Blue, Light Grey | N/A | Select Box (List: SCB Accordion Colors) | Yes | No |
Example
Accordion
You can add additional information inside each accordion or lists of links. This provides a more concise view of the page, and allows the user to see only the information that they choose, when clicking on the appropriate accordion to expand it.Cras magna turpis, egestas sit amet efficitur ac, sollicitudin elementum ante. Phasellus id auctor elit, vitae malesuada justo. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed eu ornare eros. In ut viverra quam, vitae tincidunt est. Vestibulum vitae viverra nunc. Mauris vel dui varius, gravida justo id, laoreet turpis. Suspendisse eget lectus quam. Etiam convallis efficitur orci luctus elementum. Ut erat ipsum, dictum nec mollis ut, sagittis sit amet sem. Etiam quis lorem in sapien eleifend pellentesque.
Cras magna turpis, egestas sit amet efficitur ac, sollicitudin elementum ante. Phasellus id auctor elit, vitae malesuada justo. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed eu ornare eros. In ut viverra quam, vitae tincidunt est. Vestibulum vitae viverra nunc. Mauris vel dui varius, gravida justo id, laoreet turpis. Suspendisse eget lectus quam. Etiam convallis efficitur orci luctus elementum. Ut erat ipsum, dictum nec mollis ut, sagittis sit amet sem. Etiam quis lorem in sapien eleifend pellentesque.
Cras magna turpis, egestas sit amet efficitur ac, sollicitudin elementum ante. Phasellus id auctor elit, vitae malesuada justo. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed eu ornare eros. In ut viverra quam, vitae tincidunt est. Vestibulum vitae viverra nunc. Mauris vel dui varius, gravida justo id, laoreet turpis. Suspendisse eget lectus quam. Etiam convallis efficitur orci luctus elementum. Ut erat ipsum, dictum nec mollis ut, sagittis sit amet sem. Etiam quis lorem in sapien eleifend pellentesque.