Skip to end of metadata
Go to start of metadata

You are viewing an old version of this page. View the current version.

Compare with Current View Page History

« Previous Version 42 Next »

Accordion

This page will help Sitecore Contributors become familiar with the Accordion Component. Accordion is a component that is used to show information and can be expanded or collapsed. 


Before Getting Started

Make sure you have navigated to a page you have been authorized to edit before attempting to make changes to an Accordion component.


Best Practice

This is a page formatting tool. Accordions should not be used to hide critical content. You can use an accordion to shorten page content, but steer away from concealing critical content because your audience may miss the information that you are trying to impart.

How to Add an Accordion Component

Accordion cannot be created as the first component on a home page. Sitecore only allows the following three components: Hero Banner, Slideshow, and Video to be used as the first component on a home page.

  1. Select the +Select Component area. (see image below)


  2. Select the + Add here button. (see image below)


  3. Choose Accordion(see image below)


    You can also double-click the Accordion icon to select it.

  4. Select Select. (see image above) 

  5. Select Add Component. (see image below)


  6. Select the Gear Icon to add a headline (adding a headline is optional). (see image below) 

  7. Select the Plus Icon(see image above)

  8. Hover in the area next to Title(see image below)

  9. Select the Pencil Icon to edit. (see image above) 

    An existing Accordion component will often have existing text or image(s). 

    Best Practice

    Develop an order for content being displayed to help your audience to quickly find what they need. Consider using alphabetical, chronological, or numerical ordering if possible.

  10. Select Show editor or double-click the text in the area to edit. (see image below)


  11. Select Accept to finalize the edits. If the layout option chosen had multiple sections, complete for each section. (see image below)


  12. Review the edited sections to ensure all edits have been made and then select OK(see image below)



    Back to Top

  • No labels