Authors

Video Tutorials

Engage 360: Accordion Interactions

The accordion interaction in Engage 360 lets learners explore related items in a horizontal layout. Use the accordion interaction to:

  • Walk through a list of related concepts.
  • Identify members of a group.
  • Compare several objects.

Exploring the Editor

The accordion editor has three columns with the following panels:

Steps

Located on the left side of the screen, this panel is used to manage panels for the accordion.

Text

Located in the middle of the screen, this panel is used to add text to each panel.

Audio

Located in the upper right corner of the editor, this panel is used to add and edit audio.

Media

Located in the lower right corner, this panel is used to add pictures, characters, and videos.

 

Here are some tips for working with the editor:

  • Change the width of a column by dragging its boundary with your mouse.
  • Click the triangle in the upper right corner of the audio panel to collapse it if you need more room to work with the media panel. Click it again to reopen the panel.

Adding Panels (Steps) to an Accordion

Each step in an accordion interaction is called a panel. To add a panel, do any of the following:

  • Press Ctrl+M.
  • Go to the Accordion tab on the ribbon and click Add Panel.
  • Click the Create a new step button in the lower left corner of the Steps panel.
  • Click the Duplicate button at the bottom of the Steps panel to copy the currently selected panel(s).

New panels get added just below the panel that's currently selected in the Steps panel—unless the summary is selected, in which case new panels get added above it.

Tip: An accordion interaction can have up to eight panels (not counting the introduction and summary).

Renaming Panels (Steps)

To rename a panel, do either of the following:

  • Double-click the panel in the Steps panel to open it for editing. Type the new name and press the Enter key on your keyboard.
  • Select the panel in the Steps panel, then type the new name in the title field at the top of the text panel.

Tip: You can rename the introduction or summary in the same way.

Rearranging Panels (Steps)

To change the order of panels in an accordion interaction, select one or more panels in the Steps panel, then do any of the following:

  • Drag them to a new location in the list. An orange line will move with your mouse to indicate where the panels will be dropped when your mouse button is released.
  • Go to the Accordion tab on the ribbon, click Move Panel, then select Up or Down.
  • Use the Up and Down arrows at the bottom of the Steps panel.

Tip: The introduction and summary can't be moved.

Deleting Panels (Steps)

To delete a panel from an accordion interaction, select it in the Steps panel, then do any of the following:

  • Press the Delete key on your keyboard.
  • Go to the Accordion tab on the ribbon and click Delete Panel.
  • Click the Delete button at the bottom of the Steps panel.

Tip: You can't delete the introduction or summary, but you can hide them.

Adding Content to Panels (Steps)

To add text, audio, and media to each panel in an accordion interaction, see these user guides:

Adding and Formatting Text
Adding Audio
Adding Media

You Might Also Want to Explore:

Working with the Interaction Title
Working with Interaction Properties

Published 9 years ago
Version 1.0