Banner carousel

This schema snippet is the banner carousel example. It is a simple carousel that can contain up to 6 banners. If you've worked through the get started wizard in the developer trial then a carousel and some banners have already been created for you.

Pre-requisites

The carousel is set up to include up to 6 banner content items. You must also register the tutorial banner schema in order to populate the carousel with content.

How to use

This example could be extended to include additional content types in the items array.

Setting up the carousel visualization

When you register the carousel schema as a content type, add a visualization with the following URL:

https://get-started.visualizations.content.amplience.net/?content={{content.sys.id}}&vse={{vse.domain}}

This visualization is written in React and can be found in the repository of examples used in the developer trial.

For more information about developing visualizations see the creating a visualization page.

Banner carousel

{
   "$schema":"http://json-schema.org/draft-07/schema#",
   "$id":"https://schema-examples.com/banner-carousel",
   "title":"Carousel of banners",
   "description":"A carousel that includes an array of banner types. Requires the banner content type to be registered first as a prerequisite",
   "allOf":[
      {
         "$ref":"http://bigcontent.io/cms/schema/v1/core#/definitions/content"
      }
   ],
   "type":"object",
   "properties":{
      "banners":{
         "title":"Carousel banner slides",
         "description":"banners within the carousel",
         "type":"array",
         "minItems":1,
         "maxItems":6,
         "items":{
            "allOf":[
               {
                  "$ref":"http://bigcontent.io/cms/schema/v1/core#/definitions/content-link"
               },
               {
                  "properties":{
                     "contentType":{
                        "title":"Banner Content Type",
                        "enum":[
                           "https://schema-examples.com/tutorial-banner"
                        ]
                     }
                  }
               }
            ]
         }
      }
   }
}

Content form preview

An example of creating a content item using a content type registered from the banner carousel example schema is shown in the image below.

Related pages

Tutorial banner