Accordion
Create a content accordion; a list of titles that hide or reveal content when a title is clicked.
How to use
Each accordion is a separate piece of content. Adjacent accordion content items are wrapped together to create a group of accordions. Adding a Heading will automatically start a new group of accordions.
For the first accordion in a group:
- Optionally add a Heading
- Optionally add a Description
For each accordion:
- Add a Title
- Add the Body. This is a WSYIWYG area see WSYIWYG Content for content options
Content Type Details
ID: 7279
Name: Accordion
Description: Creates an accordion style content that can be stacked.
Minimum user level: Contributor
Content Type Elements Details
| Name | Description | Size | Type | Required |
|---|---|---|---|---|
| Name | The Name Element | 80 Characters | Plain Text | Yes |
| Heading | Add a Heading to the first accordion in a group | 150 Characters | Plain Text | No |
| Description | Add a Description to the first accordion in a group | 500 Characters | Plain Text | No |
| Title | Title of the accordion | 150 Characters | Plain Text | Yes |
| Body | The main content within a WYSIWYG | 99999 Characters | HTML | Yes |
Examples
With Heading and Description
Accordion Group heading
Plain text. Lorem ipsum dolor, sit amet consectetur adipisicing elit. Incidunt facilis qui voluptatem itaque rem saepe quod architecto nihil, neque impedit molestias eveniet nam a molestiae aliquam eaque accusamus labore fugiat veritatis perferendis? Labore molestiae amet laudantium aliquam totam illo accusamus!
H2 Heading Text
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Lorem2 ipsum dolorfootnote sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
H3 Heading Text
Blockquote text. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Maecenas sed diam eget risus varius blandit sit amet non magna.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.
- Lorem ipsum dolor scelerisque nisl consectetur et.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. scelerisque nisl consectetur et.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.
- Lorem ipsum dolor scelerisque nisl consectetur et.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. scelerisque nisl consectetur et.
| Country | Capital | Language Spoken | GDP |
|---|---|---|---|
| Austria | Vienna | German | $386.4 Billion USD |
| Morocco | Rabat | Arabic | $2,832.43 Billion USD |
| El Salvador | San Salvador | Spanish | $4,223,58 Billion USD |
| Japan | Tokyo | Japanese | $4.939 Trillion USD |
Donec ullamcorper nulla non metus auctor fringilla. Donec sed odio dui. Aenean eu leo quam.
H2 Heading Text
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Lorem2 ipsum dolorfootnote sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
H3 Heading Text
Blockquote text. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Maecenas sed diam eget risus varius blandit sit amet non magna.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.
- Lorem ipsum dolor scelerisque nisl consectetur et.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. scelerisque nisl consectetur et.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.
- Lorem ipsum dolor scelerisque nisl consectetur et.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. scelerisque nisl consectetur et.
| Country | Capital | Language Spoken | GDP |
|---|---|---|---|
| Austria | Vienna | German | $386.4 Billion USD |
| Morocco | Rabat | Arabic | $2,832.43 Billion USD |
| El Salvador | San Salvador | Spanish | $4,223,58 Billion USD |
| Japan | Tokyo | Japanese | $4.939 Trillion USD |
Donec ullamcorper nulla non metus auctor fringilla. Donec sed odio dui. Aenean eu leo quam.
H2 Heading Text
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Lorem2 ipsum dolorfootnote sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
H3 Heading Text
Blockquote text. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Maecenas sed diam eget risus varius blandit sit amet non magna.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.
- Lorem ipsum dolor scelerisque nisl consectetur et.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. scelerisque nisl consectetur et.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.
- Lorem ipsum dolor scelerisque nisl consectetur et.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. scelerisque nisl consectetur et.
| Country | Capital | Language Spoken | GDP |
|---|---|---|---|
| Austria | Vienna | German | $386.4 Billion USD |
| Morocco | Rabat | Arabic | $2,832.43 Billion USD |
| El Salvador | San Salvador | Spanish | $4,223,58 Billion USD |
| Japan | Tokyo | Japanese | $4.939 Trillion USD |
Donec ullamcorper nulla non metus auctor fringilla. Donec sed odio dui. Aenean eu leo quam.
H2 Heading Text
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Lorem2 ipsum dolorfootnote sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
H3 Heading Text
Blockquote text. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Maecenas sed diam eget risus varius blandit sit amet non magna.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.
- Lorem ipsum dolor scelerisque nisl consectetur et.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. scelerisque nisl consectetur et.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.
- Lorem ipsum dolor scelerisque nisl consectetur et.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. scelerisque nisl consectetur et.
| Country | Capital | Language Spoken | GDP |
|---|---|---|---|
| Austria | Vienna | German | $386.4 Billion USD |
| Morocco | Rabat | Arabic | $2,832.43 Billion USD |
| El Salvador | San Salvador | Spanish | $4,223,58 Billion USD |
| Japan | Tokyo | Japanese | $4.939 Trillion USD |
Donec ullamcorper nulla non metus auctor fringilla. Donec sed odio dui. Aenean eu leo quam.
With Heading
Accordion Group heading
| Fee | Per Quarter | One Time Fee |
|---|---|---|
| Application Fee | $200 | |
| Wellness Fee (more than 12 credits) | $150 | |
| Wellness Fee (less than 12 credits) | $115 |
| Fee | Per Quarter | One Time Fee |
|---|---|---|
| Application Fee | $200 | |
| Wellness Fee (more than 12 credits) | $150 | |
| Wellness Fee (less than 12 credits) | $115 |
H2 Heading Text
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Lorem2 ipsum dolorfootnote sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
H3 Heading Text
Blockquote text. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Maecenas sed diam eget risus varius blandit sit amet non magna.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.
- Lorem ipsum dolor scelerisque nisl consectetur et.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. scelerisque nisl consectetur et.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.
- Lorem ipsum dolor scelerisque nisl consectetur et.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. scelerisque nisl consectetur et.
| Country | Capital | Language Spoken | GDP |
|---|---|---|---|
| Austria | Vienna | German | $386.4 Billion USD |
| Morocco | Rabat | Arabic | $2,832.43 Billion USD |
| El Salvador | San Salvador | Spanish | $4,223,58 Billion USD |
| Japan | Tokyo | Japanese | $4.939 Trillion USD |
Donec ullamcorper nulla non metus auctor fringilla. Donec sed odio dui. Aenean eu leo quam.
H2 Heading Text
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Lorem2 ipsum dolorfootnote sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
H3 Heading Text
Blockquote text. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Maecenas sed diam eget risus varius blandit sit amet non magna.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.
- Lorem ipsum dolor scelerisque nisl consectetur et.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. scelerisque nisl consectetur et.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.
- Lorem ipsum dolor scelerisque nisl consectetur et.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. scelerisque nisl consectetur et.
| Country | Capital | Language Spoken | GDP |
|---|---|---|---|
| Austria | Vienna | German | $386.4 Billion USD |
| Morocco | Rabat | Arabic | $2,832.43 Billion USD |
| El Salvador | San Salvador | Spanish | $4,223,58 Billion USD |
| Japan | Tokyo | Japanese | $4.939 Trillion USD |
Donec ullamcorper nulla non metus auctor fringilla. Donec sed odio dui. Aenean eu leo quam.
H2 Heading Text
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Lorem2 ipsum dolorfootnote sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
H3 Heading Text
Blockquote text. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Maecenas sed diam eget risus varius blandit sit amet non magna.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.
- Lorem ipsum dolor scelerisque nisl consectetur et.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. scelerisque nisl consectetur et.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.
- Lorem ipsum dolor scelerisque nisl consectetur et.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. scelerisque nisl consectetur et.
| Country | Capital | Language Spoken | GDP |
|---|---|---|---|
| Austria | Vienna | German | $386.4 Billion USD |
| Morocco | Rabat | Arabic | $2,832.43 Billion USD |
| El Salvador | San Salvador | Spanish | $4,223,58 Billion USD |
| Japan | Tokyo | Japanese | $4.939 Trillion USD |
Donec ullamcorper nulla non metus auctor fringilla. Donec sed odio dui. Aenean eu leo quam.
H2 Heading Text
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Lorem2 ipsum dolorfootnote sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
H3 Heading Text
Blockquote text. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Maecenas sed diam eget risus varius blandit sit amet non magna.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.
- Lorem ipsum dolor scelerisque nisl consectetur et.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. scelerisque nisl consectetur et.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.
- Lorem ipsum dolor scelerisque nisl consectetur et.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. scelerisque nisl consectetur et.
| Country | Capital | Language Spoken | GDP |
|---|---|---|---|
| Austria | Vienna | German | $386.4 Billion USD |
| Morocco | Rabat | Arabic | $2,832.43 Billion USD |
| El Salvador | San Salvador | Spanish | $4,223,58 Billion USD |
| Japan | Tokyo | Japanese | $4.939 Trillion USD |
Donec ullamcorper nulla non metus auctor fringilla. Donec sed odio dui. Aenean eu leo quam.
H2 Heading Text
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Lorem2 ipsum dolorfootnote sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
H3 Heading Text
Blockquote text. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Maecenas sed diam eget risus varius blandit sit amet non magna.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.
- Lorem ipsum dolor scelerisque nisl consectetur et.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. scelerisque nisl consectetur et.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.
- Lorem ipsum dolor scelerisque nisl consectetur et.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. scelerisque nisl consectetur et.
| Country | Capital | Language Spoken | GDP |
|---|---|---|---|
| Austria | Vienna | German | $386.4 Billion USD |
| Morocco | Rabat | Arabic | $2,832.43 Billion USD |
| El Salvador | San Salvador | Spanish | $4,223,58 Billion USD |
| Japan | Tokyo | Japanese | $4.939 Trillion USD |
Donec ullamcorper nulla non metus auctor fringilla. Donec sed odio dui. Aenean eu leo quam.