Curated tabs

Display up to eight tabs on a page that expand to reveal an image and text block.

Curated tabs example

An example of a curated tabs component viewed on desktop.
An example of a curated tabs component viewed on mobile.

When to use curated tabs

Curated tabs are used in conjunction with the curated tabs template. They cannot be added to any other type of page template.

The tabs appear as clickable buttons that will display in rows. Each tab includes a mandatory image and accompanying text. Curated tabs are best used to present short form content that outlines key details and signposts to further information. They are not suitable for detailed information. 

Key features and behaviour

  • The curated tabs component can be placed in any position on the page as they are added via a picker in Experience Editor. This gives you more flexibility when designing the layout of the page and how the curated tabs will be incorporated.
  • For each tab, you can select related cards to be displayed below the main content. These should relate to the selected curated tab, e.g. if the tab is about exams, related cards could be study support pages.

How to use curated tabs

  1. Create a curated tabs page template that will contain the curated tabs.
  2. In content editor, add an overarching heading and description. These fields are mandatory and the component will not display if they're not completed.  
  3. Navigate to the curated tabs component folder and create your curated tab items.
  4. Add a heading, short heading, image and copy to each tab.
  5. Navigate back to the curated tabs page template and use the picker to choose the curated tabs you want to display. You can change the order with the up and down arrows.
Screenshot showing how to add curated tabs onto a curated tab page template in Sitecore. 

Image dimensions

You will need upload the image to the Media Library in the correct dimensions.

Image dimensions

602px by 602px

Recommended word count

Curated tabs content is always short and to the point. The text should not overflow below the height of the image.

Heading

8-45 characters (with spaces)

Short heading (button) 8-25 characters (with spaces)

Body text

100-140 words

Notes on component usage 

  • Use a maximum of eight curated tabs on one page so that the tabs don't run over more than two rows on desktop.
  • Remember to publish all the curated tabs and the page template when publishing.