Adding Captions to Videos using the Media Module

Product(s)
Video Cloud
Role(s)
Studio User
Player Developer
Task(s)
Manage Videos
Topic(s)
Accessibility
Captions
Text Tracks

In this topic you will learn how to add captions to videos using the Media module.

The text tracks properties can be configured to provide captions for a video. Captions provide additional or interpretive information to individuals who wish to access it. Captions are necessary so the deaf and hard of hearing can access the audio portion of video presentations. To display captions for a video in the Brightcove player, you need to complete the following tasks:

Creating caption files

To add captions to a video, you first need to create a captions file. The Brightcove player requires that captions be in Web Video Text Tracks Format (WebVTT) format. The WebVTT file format is in plain text and contains time text data followed by the desired caption or subtitle text. A portion of a WebVTT file is shown below.

WEBVTT

00:00:00.000 --> 00:00:07.080 align:middle line:90%


00:00:07.080 --> 00:00:10.280 align:middle line:84%
Hi, I'm Bob Bailey, a Learning
Specialist with Brightcove.

00:00:10.280 --> 00:00:12.780 align:middle line:84%
In this video, you'll learn
about how Video Cloud Studio is

00:00:12.780 --> 00:00:14.940 align:middle line:84%
organized and get a
brief overview of what

00:00:14.940 --> 00:00:17.490 align:middle line:90%
you can accomplish using it.
            

Note: Caption file names should only include letters (upper or lower case), numbers, dashes (-), underscores (_) and spaces.

For more information on the WebVTT format, see this link. You should have a separate WebVTT file for each caption language you need to support. While there are many third-party tools to help create captions files, Brightcove has several partners that provide transcription, captioning and translation services. For a complete list of Brightcove partners, visit the Partners section of our website.

Configuring the text track properties

Once the caption files have been created, they can be uploaded and hosted by Brightcove or reside at an internet accessible URL.

To view and edit the text track properties for a video, open the Media module, click the video title link and locate the Text Tracks section. To configure the text track properties, follow these steps:

  1. Click Edit or double-click in the section.
  2. Select if the text track file will be uploaded to Video Cloud or hosted on an external URL.
    • File Upload - Click Browse and select the text track file from the file system. The file will be uploaded to Video Cloud.
    • URL Upload - Enter the public URL where the text track file resides and then click Upload. The file will be uploaded to Video Cloud.
    • Remote URL - Enter the public URL where the text track file resides. The URL must be less than 250 characters. Captions will be loaded from the remote URL.

      Note: If you are hosting captions files on your own server, make sure the file is located at a URL that can be accessed by the Brightcove player. The server hosting the captions file should also have Cross-Origin Resource Sharing (CORS) enabled. You can read more about CORS here.

      Note: Text track file names with parentheses, question marks, quotation marks and other special characters will silently fail when uploading. Brightcove recommends using file names without special characters.

  3. The Language field should contain the two-letter language code that specifies the language of the track text data.
  4. Enter the appropriate Label for the caption file. The label is displayed inside player and allows the viewer to select a language. If no label is supplied, the language code is displayed.
  5. Select the Kind of text track. Options include:
    • Captions - Similar to subtitles, but may also include sound effects and other audio information
    • Subtitles - The transcription or translation of the dialogue
    • Descriptions - Intended to be a separate text file that describes the video through a screen reader
    • Chapters - Intended to help the user navigate through the video
    • Metadata - Information and content about the video which isn’t intended to be displayed to the viewer by default (though you may wish to do so using JavaScript)
  6. Enter the MIME Type for the text track file. Selecting default will display the captions when the video is played (Brightcove Players 6.x and newer).
  7. Check Default (Auto Display) to make the track the default. Most browsers will attempt to display the default text track first but language and accessibility settings may override the default setting.
  8. Click Add Text Track to save the text track information.
  9. Click Add Text Track to add another text track or Save to save the text tracks.

    Note: Changes made to the text track properties may take up to 15 minutes to appear in published players.

If any text tracks have been designated as the default, they will appear in bold. To delete a text track, click the delete icon () next to the text track.

When a player with associated captions is published, a CC button will appear on the player chrome. Click the CC button to select a caption language and display the captions.

Styling captions

The default look and feel of the captions is subject to change so you may wish to style the captions. For information on styling captions, see Styling Captions.

Limitations

Captions are supported on the following device types and operating systems.

  • iOS 7+
  • Android 4+
  • Internet Explorer 8+
  • The latest Chrome, Safari, and Firefox browsers on desktops
  • There is no technical limit to the length of a caption, but in order for the full caption to be visible, the player must be large enough to display that much text