Supported Closed Caption DFXP (now TTML) Format
Closed caption files that you upload to Backlot must be in a supported format. The DFXP format (now TTML) is a popular supported format.
Supported DFXP Format
Default Styling Properties
- Language
- Text alignment
- Text background color (tts:backgroundColor) Note: Text background only displays by default when it is paired with tts:showBackground="always"
- Text color (tts:color)
- Font size (tts:fontSize)
- Font family (tts:fontFamily)
- Font style (tts:fontStyle)
- Font weight (tts:fontWeight)
- Opacity i.e. applicable to text box background or window background (tts:opacity)
Supported DFXP Tags
Ooyala supports all tags from the 2006 DFXP standard, listed below. Other tags are not supported.
Tag | Example | Additional Information |
---|---|---|
color | tts:color="green" | Ooyala only supports this in the top-level tag that wraps all other captions. |
fontSize | tts:fontSize="18" | |
textOutline | textOutline="green 2px 0px" | Applies at the paragraph level only, not in subtags. |
fontFamily | tts:fontFamily="serif" | Supports fonts installed only by the end-user or generic fonts. |
textAlign | tts:textAlign="right" | Re-aligns within the closed caption box only. This does not move the box. |
fontStyle | tts:fontStyle="italic" | Oblique style is not supported. |
fontWeight | tts:fontWeight="bold" | |
lineHeight | tts:lineHeight="32" | |
opacity | tts:opacity="0.50" | Sets opacity of the background bounding box color. |
How DFXP Settings Apply
On a browser without any cached settings, when a player and asset are loaded with DFXP settings, all attributes as marked in the list above will be applied with default settings provided in the DFXP file. Once the end user modifies the CC settings through the UI interface, DFXP settings will be overridden for all settings and replaced with player defaults and user preferences. The Flash player defaults are described in the table below.
DFXP Styling Property | Default Flash Player Setting | Additional Information |
---|---|---|
Language | first available | |
Text alignment | center | Valid values: left | center | right |
Text background color (tts:background) | none | |
Text color (tts:color) | white | |
Font size (tts:fontSize) | 14px | Value should be in px |
Font family (tts:fontFamily) | sansSerif | Only supports Generic Family Name |
Font style (tts:fontStyle) | normal | Valid values: normal) | italic) |
Font weight (tts:fontWeight) | normal | Valid values: normal) | bold) |
Opacity i.e. applicable to text background or window background (tts:opacity) | 0.7 | Valid values: 0-1. |
User preferences are saved in Flash storage so the settings are available for a user for that specific device until Flash storage is cleared. This is a one time setting that can be saved across any assets played on the Ooyala Flash player.
DFXP Example
The following is an example of a DFXP (now TTML) file with seven captions in English (xml:lang="en") and one caption in French (xml:lang="fr").
<?xml version="1.0" encoding= "UTF-8" ?> <tt xml:lang="en" xmlns="http://www.w3.org/ns/ttml" xmlns:tts="http://www.w3.org/2006/04/ttaf1#styling"> <head> <styling> <style xml:id= "defaultCaption" tts:fontSize= "12" tts:fontFamily= "sansSerif" tts:fontWeight= "normal" tts:fontStyle= "normal" tts:color= "white" tts:backgroundColor= "black" tts:showBackground= "always" tts:textAlign= "left" /> <style xml:id= "styleTwo" tts:fontFamily= "serif" tts:color= "blue" /> <style xml:id= "styleThree" tts:color= "black" tts:backgroundColor= "white" tts:fontStyle= "italic" /> <style xml:id= "styleFour" style= "styleTwo" tts:textOutline= "red 2px 0px" /> <style xml:id= "styleFive" style= "styleTwo" tts:color= "red" tts:fontWeight= "bold" /> </styling> </head> <body xml:id= "thebody"> <div style= "defaultCaption" xml:lang= "en"> <p begin= "0:00:00.00" end= "0:00:04.00">This is my 1st caption</p> <p begin= "0:00:05.00" end= "0:00:09.00" style= "styleTwo">This is my 2nd caption</p> <p begin= "0:00:10.00" end= "0:00:14.00" style= "styleThree">This is my 3rd caption</p> <p begin= "0:00:15.00" end= "0:00:19.00" style= "styleFour">This is my 4th caption</p> <p begin= "0:00:20.00" end= "0:00:24.00">This is my 5th caption <span style= "styleFive">This is a sub-caption</span> </p> <p begin= "0:00:25.00" end= "0:00:29.00">This is my 6th caption</p> <p begin= "0:00:25.00" end= "0:00:29.00" style= "styleTwo">This is my 7th caption</p> </div> <div style= "defaultCaption" xml:lang= "fr"> <p begin= "0:00:00.00" end= "0:00:34.00">Bonjour</p> </div> </body> </tt>
Closed Caption Validator
We are also providing a Ooyala Closed Captions Validator to check your DFXP/TTML documents for your convenience. However, please note that we provide Ooyala-specific DFXP support. Even if you follow the w3c document definition for DFXP/TTML, it might not be supported. If you run into any issues with your DFXP/TTML files, check with your Ooyala representative or Technical Support.