Related Content Manual Carousel

Overview

Increase user dwell time with related content

The related content carousel displays links as scrollable cards. Presenting information that the reader finds useful gives them a reason to stay on the website.

Each carousel card features the respective page’s title and a thumbnail image, pulled from the individual page data. For this component to work, you must have completed the required fields at a page level (see Step 1).

When to use

You can use the carousel when you:

• Have additional content that users would find useful to explore
• Want to cross-sell related products

When not to use

Only use the carousel when each content item is genuinely of potential interest to the readers of that page.

How to use it

Prerequisites

Before adding the component to your page, the pages you want to link to must be set up correctly. Go to the individual page and make the following checks:
 

Is the page title correct?

The page title will be displayed on the carousel card. So make sure this is how you want it to appear to users.

Don’t confuse the page title with the SEO title. The SEO title is used to help search engines understand the page.

Is there a thumbnail image?

Each card must have an image. For this to work, each page must have a thumbnail image.

To add a thumbnail image, enter edit mode and navigate to the ‘Teaser’ section at the top of the page. You can import a new image or select an existing one.

To upload a new image, select ‘import image', then ‘select file’.

Add a title and alternative text, then select ‘select image’.

For more information about uploading images to the CMS, see the ‘Image Guidelines’ advice.

Setting up the component

Step 1: Write the heading

The heading is what motivates users to click through the carousel. In most cases, this will be variations of:

• You may be interested in

For readability, the title shouldn’t occupy a full line or exceed 40 characters.

Optional step: Add a subheading

A subheading can add context to your heading. Make it punchy, and no more than ten words.

Step 2: Add your pages

You’ll see two columns:

• Available entities
• Selected entities

Start typing your chosen page into the ‘available entities’ text field.

When it appears, click and drag it across to the ‘selected entities’ column.

If you add more than four carousel cards, users will need to click the arrow to scroll across.

Recommended image specifications

For more information on how to use images in the CMS go to the Image Basics page.