Skip to main content

Media

This schema snippet shows how to define image and video links in your schemas so you can add assets from your Content Hub library to your content. When a schema contains an image or video link, the content form will display a chooser to allow the user to choose image or video content.

The schema also includes two string fields for the image alt text and video title.

Pre-requisites
Link copied!

This is a self contained example. You just need images and video in your Content Hub media library in order to try it out.

How to use
Link copied!

Images and videos are easy to include in your schemas. If you want to allow the user to choose either an image or a video using the same property, then you can define a property to allow both:

"imageorVideo": {
            "title": "Image or video",
            "allOf": [
                { "$ref": "http://bigcontent.io/cms/schema/v1/core#/definitions/image-link"},
                { "$ref": "http://bigcontent.io/cms/schema/v1/core#/definitions/video-link" }
            ]
        }
{
  "$schema": "http://json-schema.org/draft-07/schema#",
  "$id": "https://schema-examples.com/media",

  "title": "Media content item",
  "description": "Description",

  "allOf": [
    {
      "$ref": "http://bigcontent.io/cms/schema/v1/core#/definitions/content"
    }
  ],

  "type": "object",
  "properties": {
    "image": {
      "title": "Image",
      "allOf": [
        {
          "$ref": "http://bigcontent.io/cms/schema/v1/core#/definitions/image-link"
        }
      ]
    },
    "altimagetext": {
      "title": "Alt image text",
      "description": "The text to be displayed if the image cannot be displayed",
      "type": "string",
      "minLength": 0,
      "maxLength": 100
    },
    "video": {
      "title": "video",
      "allOf": [
        {
          "$ref": "http://bigcontent.io/cms/schema/v1/core#/definitions/video-link"
        }
      ]
    },
    "videotitle": {
      "title": "Video title",
      "description": "Enter the title for the video",
      "type": "string",
      "minLength": 0,
      "maxLength": 50
    }
  },
  "propertyOrder": []
}

Content form preview
Link copied!

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

Adding a content item from the media example schema

Content and media choosers