General concepts > Video encoding/streaming

DatoCMS natively supports video encoding and streaming, thanks to the integration with Mux, the fastest and most advanced cloud encoding platform for on-demand streaming video.

Every video you upload in your DatoCMS project will be instantly available for streaming. Videos are encoded while the first viewers watch them, giving you the fastest publishing time as possible. Encoded videos get cached on Mux's multi-CDN for future reuse as well.

DatoCMS can ingest almost every available codec including those for broadcast and professional applications (like H.264, H.265, VP9, and Apple ProRes) and thanks to HLS Adaptive Bitrate (ABR) streaming, every viewer will always download the right video size for its device and connection speed.

Uploading videos

You can upload videos just like you do with normal assets. From the interface you'll have access to some metadata and of course you'll be able to play the video straight away.

Then you can add a video to your models using the asset or asset gallery fields.

We also support integrations with embedded videos from YouTube/Vimeo/Facebook, but that's a separate field type.

To have an overview on the media area and its features, check out this video tutorial:

Working with the Media Manager in DatoCMS

Play video »

Changing the thumbnail

The thumbnail is provided by MUX (our video streaming partner) and if you do not specify any query parameter, MUX will default to choosing an image from the middle of your video.

Here you can learn how to change the thumbnail: https://docs.mux.com/guides/video/get-images-from-a-video#thumbnail-query-string-parameters

There is not an integrated way to manage MUX query parameters in DatoCMS at the moment.
You can hard-code the `time` information in your website code and add it to the `thumbnailUrl` that you get from our CDA, or you can store it in the upload custom data settings.

Like this, for example:

Then you can fetch `customData` via CDA

videoField {
  video {
    thumbnailUrl
  }
  customData
}

{
  "data": {
    "myModel": {
      "videoField": {
        "video": {
          "thumbnailUrl": "https://image.mux.com/xxx/thumbnail.jpg"
        },
        "customData": {
          "thumbnailTime": "20"
        }
      }
    }
  }
}

In your website code, you can join `${thumbnailUrl}?time=${customData.thumbnailTime}` with the custom data you want to build the final thumbnail Url.

What gets exposed via the APIs

Our Content Delivery API, Content Management API and all of our API clients and integrations include:

• HLS video streaming URL;

• High, medium and low quality MP4 versions of the video to support legacy browsers that do not support HLS;

• Duration and frame rate of the video;

• Thumbnail URL: resizable, croppable and available in JPEG, PNG, and GIF format;

Pricing and availability

Integration with MUX is available on all DatoCMS plans, each includes several minutes of encoding and streaming in the price. If you are on a paid plan, and you go over-quota, your website will not suffer any service interruption. At the end of the month, we’ll charge you for the difference.

What happens if you downgrade or cancel subscription?

Videos will be kept for 60 days after the last subscription ended. After that, we'll delete the video and invalidate the Mux key for streaming that video.

If you then change your mind and reactivate the project, you will need to re-upload the videos.

This behavior is particular to videos, as they can be very big and expensive to retain. This does not apply to other assets or data in general.