Local Playback of YouTube Embeds

Justin | tips | Thursday, October 3rd, 2013

The easiest way to embed a YouTube video in another webpage is to use Share > Embed, found on any YouTube video page.

YouTube has recently made a slight modification to this code by removing the protocol (http:) at the beginning of the URL:

<iframe width="560" height="315" src="//www.youtube.com/embed/CBfVgQNKa5s" 
frameborder="0" allowfullscreen></iframe>

In many respects, this an improvement. The lack of a a protocol means that this link will inherit the protocol from its container page. So if the container page is https (a secure page), the YouTube video will be as well. This avoids a security warning to IE users when loading unsecured content (the http YouTube video)  within a secured (https) webpage. This is a more flexible method, as long as your page is on a web server.

However, it means that the embedded content will not preview locally from your hard drive.

To view a working embed from you local drive, modify the embed so that the src attribute begins with http:

<iframe width="560" height="315" src="http://www.youtube.com/embed/CBfVgQNKa5s" 
frameborder="0" allowfullscreen></iframe>

The same protocol policy goes for URLs used with Google’s Hosted Libraries (like jQuery).

1 Comment »

  1. […] Local Playback of YouTube Embeds (ajarproductions.com) […]

    Pingback by Miracle Catch Gives Auburn Last-Second Win Over Georgia | SoshiTech — November 18, 2013 @ 12:57 am

RSS feed for comments on this post. TrackBack URI

Leave a comment

You may use the following html tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> .


× 1 = four

Subscribe without commenting