Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

HTML

I can't embed videos from youtube in my page?

I am trying to embed an anime opening. I'm going to the share tab, and getting the embed code. This is the code http://codepen.io/anon/pen/ghmKJ

When I save and load the page, it's just white, nothing else. Could someone please help me with this? Thank you

I had this same issue and was able to find a solution in an earlier thread, here's the link: https://teamtreehouse.com/forum/embedded-video-not-working?sort=newest&topic=HTML

Basically if you had the same problem I did it was that the URLs were missing the "http:" portion of the link. Check both URLs in your links, update and see if that works. Not sure why this happened as I had copied the old embed code exactly from YouTube and even attempted with multiple videos. Anyway, I hope this helps and good luck!

I just checked the code you had provided in your question and it looks like you are missing "http:" for each link. That should do the trick.

Thank you very much! I have actually already figured this out, but I really appreciate your help.

You're welcome! Glad you figured it out; this had me stuck for a bit so I thought I might be able to save you the same frustration :)

4 Answers

James Barnett
James Barnett
39,199 Points

Protocol-less URLs don't work without a web server, so in that case just add http: in front of the URL.

The main caveat to keep in mind when using the protocol-less reference is that it will fail on pages loaded via file:/// (i.e. HTML pages you load directly from disk to your browser). So, do be sure to include the http: protocol in the URL if you happen to be developing without a web server at all, but don’t worry about omitting it otherwise.

source: http://encosia.com/3-reasons-why-you-should-let-google-host-jquery-for-you/

Thanks for the information, very helpful.

<!DOCTYPE HTML>

<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>My Page</title>
    </head>
    <body>
        <object width="560" height="315"><param name="movie" value="//www.youtube.com/v/yv_wXhib8PE?version=3&amp;hl=en_US&amp;rel=0"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="//www.youtube.com/v/yv_wXhib8PE?version=3&amp;hl=en_US&amp;rel=0" type="application/x-shockwave-flash" width="560" height="315" allowscriptaccess="always" allowfullscreen="true"></embed></object>
    </body>
</html>

I think you can just embed a youtube video like this

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

where the src value will be your youtube video url with the embed parameter as you can see, in the url. Other than that just amke sure you are declaring an html document properly and it should work.

I am attempting to use specifically the old embed code. Even with the new one, it still doesn't work.

snarlzbarkley
snarlzbarkley
2,964 Points

I ran into this same issue and my head almost exploded. I knew I needed to add the <code>"http:"</code> to my links but that still did not work. The problem I had was that I am using the "https everywhere" add-on for chrome. So, the correct protocol was to add <code>"https:"</code> to my links and that worked.