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. The 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 componentscan be expanded or collapsed





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. 

Info
iconfalse
titleIn this guide:


Becoming Familiar with the Interface:

Accordion Component

Sitecore Advanced Editing Components Interface


Home Page Components:

Hero Banner Component Home Page

Slideshow Component Home Page

Video Component Home Page


Content Page Components:

Rich Text Editor Component

Image List and Image Grid ComponentsRich Text Editor Component

RSS Feed Component

Sitecore Advanced Editing Components Best Practices

Sitecore Advanced Editing Components Interface

Slideshow Component Home Page

Submit a Sitecore Ticket

Video Component Home Page


/wiki/spaces/UHID/pages/10964108934 


How to Add an Accordion Component

NoteAccordion 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

Info
titleBest Practice

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. An Accordion component cannot be created as the first component on a home page.

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

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

  3. Choose Accordionfrom the five options and then select Select(see image below)
    Image Added

    Note

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


  4. Image RemovedSelect Select. (see image above) 

  5. Select Add Component to create the Accordion component. (see image below)
    Image RemovedImage Added

  6. Select the Gear Icon if you want Icon to add a headline and then select (adding a headline is optional). (see image below) 
    Image Added

  7. Select the Plus Icon(see image belowabove)

    Image Removed
  8. Hover over in the area next to Title(see image below the Headline and select the)
    Image Added

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

    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.

    Image Removed

     


    Info
    titleBest Practice

    Develop an order for content being displayed alphabetically, chronologically, or numerically to help your audience 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)
    Image Removed
    Once all edits are completed, select Image Added

  11. Select Accept to finalize the edits or Reject to leave the editor without making any changes. . (see image below)
    Image Added

    Note

    If the layout option chosen had multiple sections, complete for each section. 

    (see image below)


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

    Image Added
  13. Select OK

    Note
    iconfalse

    Please click this link to give feedback for this documentation and using Sitecore Advanced Editing Components: User Survey

    Back to Toptop