Is there some way to convert the video control bar.

Balk László's picture


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's picture


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.


Balk László's picture

Hi Oliver,


This is really great. It works great, I've even managed to solve other things with it.

I was careless, because I didn't even notice that such settings can be specified during export.

I know that now, and thank you very much.


There is one more thing I would like to solve, it goes beyond editing CSS. I'll start a new thread for this.