Accordions

Accordions divide content into meaningful sections which occupy less screen space.

The Accordion visual element can be previewed on our Demo website. It is available on interior pages (standard) in the Content Layers section.

Table of Contents


How it Looks

 


How to Add Accordions

1. While editing your interior page (standard), scroll down to the Content Layers section. Select Accordion from the Select Layer Type drop-down menu.

View How to Add a Standard Interior Page for a refresher on how to build an interior page (standard) from scratch.

2. From the Number of Columns drop-down menu, select either a 1 or 2-column design for your accordion.

3. In the Section Title field, enter a title for your accordion.

4. Select a heading type from the Section Title Heading drop-down menu. You can select from <h2> to <h5>. <h2> is the highest available section level and <h5> is the lowest.

5. In the Accordion Group section, check Yes if you would like to Keep first accordion tab open (on your website). If unchecked, all accordion tabs will be closed by default.

6. In the Accordion Items section, you will find the Item Title, Enable Feed, and Item Content fields.

7. Edit the Item Title and Item Content using the WYSIWYG editor, or by making the desired changes to the text in the content fields.

You can add more Accordion Items using the green plus sign, or remove existing items with the red X sign.

To reorder Accordion Items, use the Move to TopMove UpMove Down, or Move to Bottom arrow buttons. You can also click and drag the links into place to reorder it.

8. Check Yes to Enable Feed in your accordion item. If enabled, two sections will appear below the Item Content field, XML Feed Group and Accordion Footer.

9. If the feed is enabled, paste in the XML Feed URL. Choose a numerical value for Max Items to Display on your XML feed.

10. If the feed is enabled, edit/add the content in the Accordion Footer using the WYSIWYG editor.

11. When you are done making edits to your page, click Preview Draft. After previewing the draft, click Submit to save the page to CMS.

12. The page has been successfully saved to the CMS. You must now Publish your page.

13. Select one or more of the outputs to Publish to the destinations selected.