Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Anchor
Top
Top

Accordion

This page will help Sitecore Contributors become familiar with the Accordion Component. Accordion is a component that is used to show information in list form within Sitecore. It should be noted that Accordion cannot be created as the first component. Only Hero Banner, Slideshow, and Video can be used as first components. 


Info
titleBest Practice

This is a page formatting tool. If a subject being discussed requires an abundance of information the Accordion component would be the best option for shortening a potentially long web page. 


How to Add an Accordion Component

Note

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

  1. Select anywhere in the +Select Component area to add a component. (see image below)


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


  3. Choose Accordion from the five options and then select Select(see image below)

    Note

    The Accordion can be double-clicked to select it also.



  4. Select Add Component to create the Accordion component. (see image below)


  5. Select the Gear Icon if you want to add a headline and then select the Plus Icon(see image below)



  6. Hover over the area below the Headline and select the Pencil Icon to edit. (see image below)

    Note

    An existing Accordion component will often have existing text or image(s). Make sure you have navigated to a page you have been authorized to edit before making changes to an Accordion component.



    Info
    titleBest Practice

    Develop an order for content being displayed alphabetically, chronologically, or numerically if possible.


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


  8. Once all edits are completed, select Accept to finalize the edits or Reject to leave the editor without making any changes. If the layout option chosen had multiple sections, complete for each section. (see image below)



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



    Back to Top

...