Insert collapsible content

Collapsible content is great for having a lot of content on one page in a format that allows users to easily scan content and expand only the content that is relevant for them. It can be useful for FAQs, policies, or details on a variety of products. Collapsible content can easily be added in the Rich Text Editor when editing an intranet page.

Titles or summaries of collapsible content display with an arrow or caret icon beside them to indicate that the content can be expanded and display more content. When the content is collapsed, the arrow/caret points right, when the content is expanded the arrow/caret points down.

Collapsible content on a page is collapsed by default when someone views it. The user can expand and collapse content as desired. When the user visits the page again the content will be collapsed regardless of whether they expanded it the last time they viewed the page.

When a second layer of collapsible content is created, the first layer automatically gets color applied to the summary/title field to differentiate the first layer from the second layer of collapsible content. The color for this field comes from the Colors > Button > Normal setting on the Admin panel Theme page.

Add collapsible content

1. Go into edit mode and place the cursor where you want to add collapsible content in the Rich Text Editor.
2. Click the Add collapsible container icon in the Rich Text Editor toolbar.
   
   
    
3. In the Collapsible container that appears, click in the Enter summary text... field and type a title or summary for the collapsible content.
   
   
    
4. Click in the Enter body content... field and type the content that you want to be able to expand and collapse.
5. Continue editing the page or click Save.

Add multiple layers of collapsible content

A second layer of collapsible content containers can be nested under the layer that is initially seen on an intranet page.

1. In edit mode, place the cursor in the Enter body content... field of an existing collapsible container.
2. Click the Add collapsible container icon again to add another layer of collapsible content.
   
   
    
3. A new collapsible container will appear, and the summary/title field of the first layer of collapsible content will be filled with an accent color to differentiate it from layers below it. Add summary/title and body text as described under Add collapsible content above.
   
   
    
4. To add another collapsible content container in the second layer, place your cursor below the content you just created and click the Add collapsible container icon again. Repeat to add more collapsible content containers.
   
   
    
5. To change the order of the content containers, hover over a container, click on the square that appears on the top left of the container, and drag and drop the container into the order you want.
   
   
    
6. Continue editing the page or click Save.

Delete collapsible content

1. In edit mode, hover over the collapsible container you want to delete, and click on the square that appears on the top left of the container to select it.
2. Once the container is selected, tap Backspace or Delete on your keyboard to delete it.
3. Continue editing the page or click Save.