Show closed captions (CC) for videos
The above demo shows Captions from a SubRib file. You will need a recent version of Flash installed to view this video, a H.264 encoded mp4 file. The first subtitle comes after 13 seconds.
Closed Captioning is a term describing several systems developed to display text on a video screen to provide additional or interpretive information to viewers who wish to access it. The most common use is to provide subtitles for movies. See here for more info.
- Loading subtitles from the Timed Text or Subrip format files.
- Styling text from styles set in the Timed Text format files.
- Loading of subtitles from embedded FLV cuepoints.
- Loading of subtitles from embedded subtitles tracks in MP4 files.
- Controls an external Content plugin to show the cuepoints.
Timed Text is a W3C specification for delivering captioning and video description for the web. You can find the spec here in the W3C site.
SubRip is a common format for distributing Captions for DVD rips. It is the native subtitle format of the SubRip program.
Timed text example
The timed text XML file used in this example is shown below. The style
definitions are in the first part of the file inside the
head element and
below that we have the Captions inside the
The first caption does not include the
style attribute and therefore the
style used to render it comes from the styling settings used to configure our
Content plugin. The second caption uses the style with id 1 that defines a
white font and left text alignment. The third caption has a small font coming
from the 2nd style referenced by its id 2.
Embedded Captions example
This example show Captions based on data included in cuepoints that are embedded in the video file. The cuepoints were embedded into the video using RichFLV. The first caption is at 6 seconds.
The file used in the example above has cuepoints at the following points of
the timeline: 6000, 13500, 16000, and at 20000 milliseconds. Using the RichFLV
application it's easy to add them. Each of these cuepoints has one parameter
text that contins the text displayed as the caption text.
MP4 Embedded Captions example
This example show Captions based on data included in subtitle tracks of a MP4
container. There can be several subtitle tracks in the video, and you can
choose which you want to see displayed. You can filter the subtitle tracks
thanks to the
captionsTrackFilter property of your clip.
The file used in the example above has 2 subtitle tracks and you can change
the displayed subtitles track by simply updating the
property of the clip.
Note: When encoding MP4 videos with subtitle tracks make sure that you interleave
the media and subtitle hint tracks tightly - especially when deploying via
pseudostreaming. With MP4Box this can be achieved by passing the
-tight option or
an equivalent which your software provides.
Here is a list of all Captions specific clip properties. These go under the
clip node in the player configuration:
Path to a Timed Text or SubRip Captions file.
Show Captions for this clip. You can set this to false if you have embedded Captions in the video and you don't want to show them.
When using an embedded subtitle track from a MP4 container, use the
It must be in the form of key=value and the plugin won't display
subtitles that don't match that filter. Usually, captionTrackFilter
Here is a list of configuration options for the Captions plugin. These go
under the Captions
plugin node in the player configuration:
The name of a Content plugin configured to show the Captions. The plugin needs to be specified in the player's initial configuration.
Used with embedded cuepoints. A template string that specifies tokens for names of cuepoint parameters. The tokens are replaced by values that are looked up from the cuepoint parameters.
If you embed cuepoints where the subtitles are in the cuepoint
Display properties for the CC-button. The default
The captions plugin has the following custom methods that can be used at runtime:
Loads captions for the specified clip. The
Get latest version of the Flowplayer Captions plugin.
just the working flash file to get you going
working flash file (swf) + README.txt and LICENSE.txt
Please right-click and choose "Save link as..." (or similar)
This is a Flash plugin, and its features are therefore not available on iOS. For iOS please consult the ipad plugin.
See the version history for this tool.
Found a bug?
If you encounter problems in this script, please send a bug report to the bug reporting forum. If you have a problematic page, including a direct URL to that page is by far the most effective way of helping us to find a bug.