Featured Categories
-
Lectora®
Lectora® is the most trusted authoring tool in the world. Rock out your creativity! Author courses any way you like. Lectora adheres to best practices for Accessibility and Web Content Accessibility Guidelines (WCAG), offers responsive authoring for eLearning, and publishes to any LMS (Learning Management System).
-
CenarioVR®
Experience virtual reality through CenarioVR®, our training and virtual reality (VR) authoring software that allows you to create immersive learning in minutes! No coding required!
-
Rockstar Learning Platform®
Our Rockstar Learning Platform® has all the features you’ll love. Help your employees be better at their jobs, more valuable to your company, and most effective in servicing your customers.
-
The Training Arcade®
Level up your learner engagement with the Training Arcade®! The Training Arcade is a library of fun, mobile-ready, casual games that can be rapidly customized with your content to create effective gaming!
-
ELB Learning Content
Did you know that our AssetLibrary™ has over 120 million engaging, interactive, and awe-inspiring templates and assets to help you become an eLearning Rockstar®?
Formatting of Closed Captions in Lectora Online

Could really do with some help around the formatting of Closed Captions in Lectora Online. I've inserted several MP4 video files into a title, and also added VTT closed caption files for each. However when the title is previewed or published the captions are shown in white text with a transparent background making them unreadable against the lighter parts of the video.
I added some CSS code to the top of each VTT file (shown below) but the background is partially transparent and I can't seem to add line spacing or set the caption background to be completely black rather than transparent.
I'm surprised there isn't a way to set the default look and feel of closed captions - is anyone able to suggest anything? Unfortunately I'm awful at CSS

Thanks in advance,
STYLE
::cue {
background: black;
color: white;
}
Comments
-
Christie Calahan Community Member, Administrator, Lectora® Accessibility Group (LAUG) Member, eLearning Brothers® Partner Posts: 30 eLearning ROCKSTAR Admin TeamIt looks like you may have stumped the community! I am sure our customer solutions team can help, please submit a ticket to them here:
https://knowledgebase.elearningbrothers.com/submit-a-case-to-customer-solutions1 -
@ewalsh-3688, here's a way to modify the background of the caption. You can add this at the title level to inherit on every page, or place on individual pages and modify the color based on that page's video colors.
Create an action to run "On Show" -> "Run Javascript". Then place this code in the javascript box:
triv$( '.mejs__captions-text', getDisplayDocument() ).css("background-color","black");
You can change the "black" to any valid CSS color.2 -
@jholland that works perfectly, thank you1
Categories
- 35.9K All Categories
- 110 ✫ Announcements
- 33.2K Lectora®
- 31.1K Lectora Discussions
- 29K Lectora Desktop
- 2K Lectora Online
- 2K Lectora Feature Requests
- 71 Lectora User Groups
- 27 ELB Learning Content
- 27 ELB Learning Content Discussions
- 345 CenarioVR®
- 205 CenarioVR Discussions
- 140 CenarioVR Feature Requests
- 44 Rockstar Learning Platform®
- 41 Rockstar Learning Platform Discussions
- 108 CourseMill®
- 108 CourseMill Discussions
- 48 ReviewLink®
- 48 ReviewLink Discussions
- 7 The Training Arcade®
- 7 The Training Arcade Discussions
- 938 All Things eLearning
- 39 eLearning Development
- 546 Learning Management System (LMS) Integration
- 333 Web Accessibility
- 1.2K ♪ The Green Room
- 9 Additional Learning Products