This tutorial shows you how to use the "getTextTracks" and "setTextTrack" functions to automatically enable a subtitle track on load.

Please note that the following functions can be performed only after you have successfully undertaken the first steps (see the "Getting started" chapter). You will also need to replace the video and player IDs with your own.

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Page Title</title>
    <script>
      window.addEventListener("load", (event) => {
        setTimeout(function () {
          var player = VideoPlayer.Collection.getPlayerById("user-defined-id");
          var tracks = player.getTextTracks() || [];
          if (tracks[0] && tracks[0].id) {
            player.setTextTrack(tracks[0].id)
          }
        }, 2000);
      });
    </script>
  </head>
  <body>
    <div
      mi24-video-player
      id="user-defined-id"
      video-id="video-id"
      player-id="player-id"
      channel-id="channel-id"
      config-type="vmpro"
      flash-path="//e.video-cdn.net/v2/"
      api-url="//d.video-cdn.net/play"
    ></div>
    <script src="//e.video-cdn.net/v2/embed.js"></script>
  </body>
</html>


The example above gets a list of track objects (using the API's "getTextTracks" function). If there are text tracks present, it enables the first one automatically.
We added a 2000ms timeout for convenience (to give the player time to load). Feel free to modify this logic, as it is not related to the subtitles functionality.