How to customize caption settings?

Note
This support website will be decommissioned on 16th December 2022.
For up-to-date information, please refer to documentation on Lumen.com.

As our open-source Video.js HLS Source Handler is based on Hls.js it is required that all caption settings are embedded in the stream VTT file.

If this is not the case, we provide the capability to override those caption settings.

All settings respect the WebVTT standard.

Hereunder are two examples of how to do so.

With Video.js

Add the captionConfig object:

<video id="demoplayer" class="video-js" controls>
  <source src="YOUR_PLAYLIST_URL" type="application/x-mpegURL">
</video>
<script>
  var options = {
    html5: {
      hlsjsConfig: {},
      captionConfig: {
        line: -1,
        align: 'center',
        position: 50,
        size: 40,
      },
    },
    dnaConfig: {},
  };
  var player = videojs("demoplayer", options);
</script>

With Brightcove

Add the following Name and Options:

In this article