How to add YouTube path to html5 player?

I’m trying to figure out how to correctly add this YouTube path(example):

<iframe width="560" height="315"     src="//www.youtube.com/embed/2AV7JuSofmng?modestbranding=1;rel=0;
controls=0;autoplay=0" frameborder="0" allowfullscreen></iframe>

to this html5 player:

<video width="135" height="130" type="video/mp4"     poster="../img/test.jpg" src="../video/test.mp4"></video>

I tried this without success:

<video width="135" height="130" type="video/mp4" poster="../img/test.jpg" src="http://www.youtube.com/embed/2AV7JuSofmng?modestbranding=1"></video>

Any help will be appreciated.

 <video preload="metadata" width="135" height="130" type="video/mp4" poster="../img/test.jpg">
    <source src="../video/test.mp4" type="video/mp4" />
  </video>

Try that?

I’m probably not being clear. I’m trying to add the youtube path. I don’t see the youtube path in your reply. Any additional help will be appreciated.

You can not directly use Youtube videos to source(src) without Javascript.

Take a look at this JS library:
http://mediaelementjs.com/examples/?name=youtube

1 Like

No I misread your post. I thought you had said the video wasn’t loading at all. My apologies.

dogagenc, thanks for your reply and link.
I’m working on adding that.
In the meantime, can a video from YouTube, be played on a web page with third party player, like mediaelement, without showing the YouTube brand?

This is against their TOS. If you want to remove the YouTube brand, then store the files as video files on your own server and use html5.

The following commercial uses are permitted provided that You comply with all other terms and conditions of this Agreement:

  • the placement of Your own branding on the API Client, provided that it does not interfere with YouTube audiovisual content playback or with any YouTube branding;

Not to mention, it’s very unethical.

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.