Is there some way to convert the video control bar.

Submitted by Balk László on Mon, 01/16/2023 - 20:46

Forums:

Developers

Hello,

I made an interactive video using Lumi. I exported it all to a .html file.

I would like to ask if there is some way to convert the video control bar.

I would like to remove the "Playback speed", "Subtitles" and "Video quality" buttons.

The Play button, progress bar, Speaker on/off icon, and Full Screen icon are required to remain.

If there is a solution for this, how can it be easily added to additional HTML files created later.

I mean, if the above can be done with css, then is it enough to write the loading of the css in the exported HTML file and put the css in the same folder next to the html file?

Any help is greatly appreciated.

otacke

Tue, 01/17/2023 - 11:12

Permalink

Hi!This can easily be done

Hi!

This can easily be done via CSS if you add a css file containing

.h5p-interactive-video .h5p-control.h5p-playbackRate,
.h5p-interactive-video .h5p-control.h5p-captions,
.h5p-interactive-video .h5p-control.h5p-quality,
.h5p-interactive-video .h5p-control.h5p-more {
  display: none;
}

when exporting.

If you want to change this after exporting, you'd have to change the html file. The additional CSS can be found at the end easily. You can add it to the existing files. Using a separate stylesheet file will work by adding a link like

<link rel="stylesheet" href="file-name-here.css">

within the <head></head> tag group of the HTML file. Mind the path to the file.

Best,
Oliver

Balk László

Tue, 01/17/2023 - 22:01

Permalink