CODEWITHSUNDEEP
javascriptvideoyoutube
chris3spice
chris3spice

Reputation: 183

YouTube stream show subtitles below player

I am have been playing around with a lot of options. popcorn.js, mediaelement.js, jwplayer and I can not find a combination that works. I'm working on a learning website and I need to display the subtitles of the video below the player. I can get it to work all good when the video is hosted on the server and it has a file link. I was using MediaElement.js because all the videos I need are on YouTube so it needs to stream from there.

I have tried a few different combinations and popcorn was originally going to work. When I started playing with it I found their YouTube streaming no longer works. I've followed their examples but its a no-go. Also with popcorn I couldn't get to work with any other subtitle file other than TTML (even though they support the others) and I need one that can have html inside of it.

My latest endeavor got me using the script from here: http://www.storiesinflight.com/js_videosub/#code

This lets me use .srt which is good, but I can't get it to let me stream YouTube with any other JavaScript players so I'm back to where I started.

I have seen a post about going through one of the transcoding websites and using the .mp4 link, but I don't want to rely on a middleman. If that site shuts down then my site will also be screwed. I doubt YouTube is going anywhere anytime soon.

Upvotes: 0

Views: 567

Answers (1)

Rachel Gallen
Rachel Gallen

Reputation: 28563

There's a surefire way to do this and that's to create your subtitles in notepad and then upload them to youtube

Then Go to your Account Settings page in Youtube

  • Select Playback from the left-hand menu
  • Select/check 'Always show captions'

You should Check Show automatic captions by speech recognition (when available) to enable automatic captions for videos that don't already have captions provided)

  • Save! and you're done

No javascript required

Upvotes: 1

Related Questions