Recommendations for styling captions
How to make sure that captions look great
Caption styling is done on the player level. Our player plugins do not make changes to the styling - except for THEOPlayer, where we set the default font size to 80% (unless specified otherwise).
Line length
The captions of CaptionHub Live are at most 2 lines, with 70 characters per line. For a good viewer experience you’ll need to make sure that the 70 characters fit on a single line, to avoid wrapping.
Testing line lengths
Getting the font size in your player right can be tricky. In order to test your styling, you can use the following snippet to add a very wide caption of 2 x 70 characters to a player on the page:
const video = document.querySelector('video');
const track = video.addTextTrack('subtitles', 'Subtitle tester', 'en');
track.mode = 'showing';
const cue = new VTTCue(0, 999999, "Wow! Wow! Many warm, wide mountains move quietly over moonlit waters.\nQuick wolves jump among mellow woods, making moving waves with motes.");
track.addCue(cue);This should look something like this, without line wrapping:
Did this answer your question?
😞
😐
🤩