Follow

Expand/Collapse Content Tool

The Expand/Collapse tool is a Main Body tool that is designed to provide display content with the option of expanding to show additional information. For example, this could be used for a FAQ or Question and Answer page.

Watch the video.

Expand/Collapse Content Tool Options

ECC_3.jpg

  1. edit: Add/edit/remove tool heading, change tool status to inactive/active, or schedule a status change.
  2. Add Content Item: opens the Add Content Item screen to create a new item.
  3. +: Select the “+” to see the item expanded
  4. Update: Update the content item
  5. Delete: Delete the content item
  6. Change Position: Change the position of the tool on the current page
  7. Move: Change the location of this tool to another page by selecting the desired category and page
  8. Preview: Opens a new tab to preview the page
  9. Delete: Deletes the tool from the page

Add Content Item

In the Expand/Collapse Content tool, select Add Content Item to open the Add Content Item screen.

 

ECC_4.jpg

  1. Position After: The drop-down menu is used to position items in relation to one another on the page.
  2. Initial Content: The 'heading' of the content.  This will appears with a “+” link in front of it on the page.
  3. Expanded Content:  The additional text that appears when the “+” link is clicked.
  4. Graphic Upload: Use the Choose File link to select a graphic that will show in the expanded content.
  5. Justification: Select the justification of the graphic in the expanded content.
  6. Image Width: Select the size of the graphic in the expanded content. The default size is 300 pixels wide.
  7. Alt Text: If a graphic is added, always include alternate text that describes the photo for accessibility purposes.
  8. Caption: Allows for a caption to be displayed under the image.
  9. Link Graphic To: Add a URL to make the graphic a link.
  10. Graphic Link Type: If a link is added in the "Link Graphic To:" option use the radio buttons to determine if the URL should open in a New Browser Window (external website) or in Existing Browser Window (internal page.)
  11. Select Add to add the content item to the tool.

Expand/Collapse Content Display Examples

ECC_5.jpg

Example of the collapsed content compared to expanded content that has text and a graphic.

ECC_6.jpg

Example of the tool with 2 collapsed items (+) and one expanded item (-).

Was this article helpful?
0 out of 0 found this helpful
Have more questions? Submit a request

0 Comments

Please sign in to leave a comment.