Documentation

Interactive Transcripts

Scope of support

Radiant Media Player supports interactive transcripts in the following format:

  • Side-loaded WebVTT transcript file for on-demand video. WebVTT file is passed to the player through the transcript player setting.

The interactive transcripts will be displayed in a side menu at the right of the player.

While the WebVTT transcript file can be different from the WebVTT closed captions file passed through the ccFiles setting, you can use the same file for both to add transcript and closed caption to the player

Player layout

Player code example - see this example here

<!-- Include Radiant Media Player JavaScript file in your <body> or <head> -->
<script src="https://cdn.radiantmediatechs.com/rmp/9.15.3/js/rmp-hlsjs.min.js"></script>
<!-- Transcripts and player container element -->
<div class="rmp-transcripts-container">
  <div class="rmp-transcripts-player-wrapper">
    <div id="rmp"></div>
  </div>
</div>
<script>
  const src = {
    hls: 'https://your-hls-url.m3u8'
  };
  // Your player settings
  const settings = {
    licenseKey: 'your-license-key',
    src: src,
    width: 640,
    height: 360,
    // Passing transcript to the player
    transcripts: [
      ['English', 'https://www.radiantmediaplayer.com/media/vtt/transcripts/transcript.vtt']
    ],
    contentMetadata: {
      poster: [
        'https://your-poster-url.jpg'
      ]
    }
  };
  const rmp = new RadiantMP('rmp');
  rmp.init(settings);
</script>

Player settings

transcripts: Array

This setting holds the WebVTT transcript file to be displayed along the video. Default: []. Example:

const transcripts = [
  ['English', 'https://www.radiantmediaplayer.com/media/vtt/transcripts/transcript.vtt']
];

transcripts[i]: Array

  • transcripts[i][0]: String, is the human-readable label for the transcript language
  • transcripts[i][1]: String, is the WebVTT transcript file URI
Except as otherwise noted, the content of this page is licensed under the Creative Commons Attribution 3.0 License.

©2015-2024 Radiant Media Player. All Rights Reserved.