Advanced player setting: Change the default caption style


About

You can change the default caption style through the player’s Advanced Settings. This configuration is not exposed in the standard Player Studio interface.

Use this setting to control how captions appear in the player, including font family, size, alignment, and colors.

Access the advanced settings

VOD Audio Reels

  1. Log in to your KMC and click the Studio tab. 
  2. The Player Studio page displays. 

  3. Click the player you want to edit from the list (or use the search bar in the top right).
  4. If you haven't created a player yet, check out our article Create a player for guidance.

    The player settings display.

  5. Scroll to the bottom of the player settings and click Advanced Settings.
  6. The Advanced Settings editor displays.

Change the default caption style

  1. In the Advanced Settings tab, hover over text then click the green+ icon.
  2. The Key Name box displays.

  3. In the box, enter textStyle, then click the green checkmark or press 'enter' on your keyboard.
  4. You see the new setting listed.

  5. Hover over the setting and click the green edit icon.
  6. A box containing a null value displays.

  7. Replace the word null with your style settings exactly as shown below (make sure to include the opening and closing curly brackets { }), then click the small green checkmark.
  8. It will look something like this:

    When entering JSON:

    • Make sure each line ends with a comma except the last one before a closing bracket.
    • Use double quotes " around key names and string values.
    • Use square brackets [ ] for color (as well as edge values if used, as shown in the advanced example below).
  9. Click Save at the top right before exiting.

Here are the results of our configuration:

Here's a more advanced example that includes additional style options:

"text": {
  "textTrackDisplaySetting": {
   "align": "center"
  },
  "textStyle": {
   "fontFamily": "sans-serif",
   "fontSize": "100%",
   "textAlign": "center",
   "fontColor": [
    255,
    255,
    255
   ],
   "fontOpacity": 1,
   "backgroundColor": [
    0,
    0,
    0
   ],
   "backgroundOpacity": 0,
   "fontEdge": [
    [34,34,34,2,2,3],
    [34,34,34,2,2,4],
    [34,34,34,2,2,5]
   ]
  }
},

See the Kaltura Playkit JS configuration guide for more information.

This setup corresponds to these options in the player:


Was this article helpful?
Thank you for your feedback!
User Icon

Thank you! Your comment has been submitted.

In this article
Related articles