Purpose

Accordions provide a way for content to be organized into collapsible sections that users can expand or collapse by clicking on the title. This works well where you want to present additional details without overwhelming visitors.

When to Use

This microcontent type can only be added to basic pages. Accordions work well for long lists of content that authors would like to place in different parts of the site. 

Elements

  • Title: limited to 70 characters and can be hidden
  • Description: optional and can be up to 200 characters
  • List items: title limited to 120 characters and details unlimited with basic text formatting
  • Total of 20 items max within a single accordion

First you will create an accordion, and then "place" the accordion onto a Basic Page.

1

Log in to your site

Everyone who writes things on this website has a special title. These titles give them certain abilities, like who can edit, review and publish what. You can ask for a different title or take one away from someone using the user manager.

2

Navigate to /admin/content/micro

This Admin view displays all micro-content on the site and allows authors to sort & filter the list. Authors can edit micro-content types from this view.

Microcontent filter

Microcontent is constrained to items that are typically "placed" elsewhere. For example: microcontent such as accordions, promos, link collections and visual link collections, and statistics are created and then may be utilized throughout the site.

3

Create a new "Accordion"

Click on "Add micro-content" and select "Accordion". This will open up a blank accordion form for you to complete. Once you've created your Accordion content, be sure to save. 

Shortcuts to add Accordion content:

  • Navigate to /node/add/accordion
  • Hover over Content -- Add micro-content and select Accordion
4

Place the "Accordion" content on a Basic Page

Once your Accordion is created, you can place it on a Basic Page. 

  1. Edit the Basic Page you would like to add the Accordion to. 
  2. In the Body field, select the "Insert from Component Library" tool and choose "Accordion". 
  3. example of the insert from component library button for embedding microcontent
  4. Select the "Accordion Library" tab and choose the micro-content you created. 
  5. Set alignment if applicable and click "Embed".

Learn About Different Levels of Authors, which use an accordion inside a Basic Page.

5

How to Edit a Micro-Content

You can quickly edit micro-content like accordions within your Basic Page by clicking on the micro-content within the Body field and then clicking on the gear icon.

example of how to edit an accordion

Another method to editing micro-content would be to navigate to /admin/content/micro and click on the "Edit" button beside the micro-content you'd like to edit.

Screenshot of Admin Micro-content view
6

Confirm your knowledge

If you need visual guidance that shows the step-by-step process of creating things for your website make sure to go to our Video Training Page!