Creating a dynamic carousel with content groups

Overview

When creating your experiences, you can utilise content groups to dynamically populate the carousel component.

When selecting a dynamically-populated carousel, you have two options available to you:

Carousel – No Child
Carousel – With Child

Carousel – No Child

A typical scenario for a carousel with no child is a carousel of brands, features or industries, which do not require a subsequent detailed page on each carousel item.

You may be using this as a navigational aid to other pages, or simply to showcase a list of information.

How to create a Carousel – No Child

Create a content group that you would like to use
Go to sections
Either select an existing section, or create a new section
Insert a page
Select “Carousel“
A tab will appear above the component list called “Content“
Go to the tab “Content“
Go to “Items“
From the dropdown list of “Content Group” select the relevant content group
From the list of content group items, select all items or select individual items by clicking the relevant checkbox(es)
Go to “Slots“
Assign the relevant content group items to the carousel card slots
Click “Confirm” and your carousel will be dynamically populated.

Note: Carousels are not automatically updated with new items that are added to a content group, this ensures that only items that are ready are visible to end users. Please see – Updating a Content Group for Use in a Dynamic Carousel or Grid

Carousel – With Child

A typical scenario for a carousel with child is a carousel of products, services or reference points, which require a more detailed page (the ‘child’ page) on each carousel item.

As well as the carousel being dynamically populated, the child page is also dynamically populated through a template which you can create.

How to create a Carousel – With Child

Creating your Carousel

Create a content group that you would like to use.
Go to sections
Either select an existing section, or create a new section
Insert a page
Select “Carousel With Child“
A tab will appear above the component list called “Content“
Go to the tab “Content“
Go to “Items“
From the dropdown list of “Content Group” select the relevant content group
From the list of content group items, select all items or select individual items by clicking the relevant checkbox(es)
Go to “Slots“
Assign the relevant content group items to the carousel card slots
Click “Confirm” and your carousel will be dynamically populated, with a child page added.
It is advised at this point to rename the pages appropriately.

Populating your Child Page

Within the child page select a component. A Block Page is recommended
Within the block page, insert a block
Click on the inserted block
Attach content to that block

Previewing your content

Click on “Page Settings“
Click on the dropdown under “Preview content item“
Select any item from your content group to see how your template appears with different items within your content group

Carousel Card Slots Explained

Each item in the carousel is contained within a card.

The cards can be populated using slots. These slots are shown in this visual:

To populate these slots, select any value from the dropdown list for each slot. The options available will be determine by the content group chosen.

Only applicable field types will be shown (e.g. media fields for image).

If a slot is left “Unassigned” then it will not appear on the card.

Attach Content

With a block selected, click on the attach content button, highlighted below.

Then from block slots, choose any available fields which are present in the content group selected.

Only appropriate fields will be displayed – such as text for text blocks, and media for any media-related blocks. These fields are established when you create your content group.