The carousel sample is a simple example of linked content: content that includes links to external content items. In this case the parent content item is a carousel that links to one or more child items: the carousel slides. This type of content makes it easy to reuse content items. For example, the carousel slides could be used in more than one carousel or grid.
On this page we've included carousel and carousel slide content types and visualizations for both types. We also show you how to register the content types so you can use them to create content. You must register both the carousel and carousel slide before you can create a carousel and add slides to it.
The carousel content type
The carousel content type stores the carousel slides in an array of between 1 and 6 items (minItems and maxItems). There are no additional properties included in the carousel.
In many cases when designing linked content such as a carousel or a grid, you'd design the content type so that users would be able to add more than one type of content. So the carousel could include a banner and a video as well as an image, for example. See Content choosers for more information about linking to external content.
In this example we've set up the carousel so that it can contain between 1 and 6 carousel slides, but to allow other types of content to be added you can add additional content types to the enum in the slides property. You'd also need to add the code to render these additional types.
To register the carousel content type on the current hub, choose "Content types" from the Development menu, click the "Register Content Type" button and enter the URI in the Content type URI field. If you wish to use the carousel from this example, use the following URI to register it. You will also need to enable it in all the content repositories in which you want to create content from the carousel content type.
If you want to create your own version of this content type, you can upload your version to a hosting service and update the id field to the URI of its new location. You would then register the content type using the new URI.
To choose the content card, click the "+" icon in the content type card section to choose a card. In the example below we have used the gallery card and mapped each of the 4 images shown on the card to the image of the first 4 carousel slides. image0 on the gallery card is set to /slides/0/image, image1 to /slides/0/image and so on.
Visit Cards for more details on using the built-in cards. For a custom card that cycles through each of the carousel images in turn, see the Custom cards page.
Here's the card for a carousel content item in the Content Library. The gallery card shows 4 carousel slide images in a grid.