Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

HTML

Posted by Alfons Pineda
Alfons Pineda
Courses Plus Student 1,287 Points

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

J.R. Sedivy
J.R. Sedivy
2,545 Points

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!

J.R. Sedivy
J.R. Sedivy
2,545 Points

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.

Alfons Pineda
Alfons Pineda
Courses Plus Student 1,287 Points

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

J.R. Sedivy
J.R. Sedivy
2,545 Points

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
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/

Alfons Pineda
Alfons Pineda
Courses Plus Student 1,287 Points

Thanks for the information, very helpful.

Alfons Pineda
PLUS
Alfons Pineda
Courses Plus Student 1,287 Points
Alfons Pineda
Alfons Pineda
Courses Plus Student 1,287 Points 
<!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>
Twiz T
Twiz T
12,588 Points
Twiz T
Twiz T
12,588 Points

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.

Alfons Pineda
Alfons Pineda
Courses Plus Student 1,287 Points

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
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.