[SOLVED] .vtt subs to video

video

(Jeroen Carelse) #1

Hi all, still learning and after some hours of various attempts I have to call in the experts or smart people :slight_smile:

My I finally want to have:
a Hype document that plays a video with custom play/pause and rewind buttons, and, which has various language subtitles in a space below the video.

However, for now I am content with a html5 video that loads .vtt files and displays them.
I studied the following:





but can’t seem to piece this together.

Any hints, examples or tips?
Attached is where I ended up after many more complex and failing attempts :slight_smile: 20sec-subs.zip (165.1 KB)


(Jeroen Carelse) #2

Update:
what was missing was:
WEBVTT at the beginning of the .vtt file

And then I got the correct code for the video container:


(Jeroen Carelse) #3

And here is my template, perhaps useful for others who needs to get a head start with subtitles and movies.
superman.zip (31.7 KB)
My next steps are:

  • customs buttons
  • hyperlinks in the rendered subs or a layer on top of the video with links

#4

Thanks for sharing this with us :sunny:


(Jeroen Carelse) #5

And now working on the next step :slight_smile:
Loading metadata with active links… not sure if this is gonna work but if one doesn’t try