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

Tyler Anyan
Tyler Anyan
2,976 Points

Issue embedding youtube video

I am currently following the Front end web development track and am on the embedded elements portion. I am following the instructional video down to the letter but for some reason I absolutely cannot get the youtube video to successfully embed. If I use the older, <object> embed method nothing happens at all, if I try the newer <iframe> tag I get an error box saying the file cannot be found. I am strictly using the code straight out of youtube, not trying to get cute with any tweaks or changes of my own but it still will not work. I am using firefox on Linux Ubuntu 12.04 OS if that possibly is related to the problem (if so how is it fixed?).

Here is my code with the old embed code:

'''html <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>My Page</title> </head> <body> <object width="420" height="315"><param name="movie" value="//www.youtube.com/v/_OBlgSz8sSM?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/_OBlgSz8sSM?version=3&amp;hl=en_US&amp;rel=0" type="application/x-shockwave-flash" width="420" height="315" allowscriptaccess="always" allowfullscreen="true"></embed></object>

</body> </html>'''

Here is my code with new embed code:

'''html <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>My Page</title> </head> <body> <iframe width="420" height="315" src="//www.youtube.com/embed/_OBlgSz8sSM?rel=0" frameborder="0" allowfullscreen></iframe> </body> </html>'''

Any suggestions?

Tyler Anyan
Tyler Anyan
2,976 Points

sorry, here is the actual code (edit button not working for some reason): Old: <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>My Page</title> </head> <body> <object width="420" height="315"><param name="movie" value="//www.youtube.com/v/_OBlgSz8sSM?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/_OBlgSz8sSM?version=3&amp;hl=en_US&amp;rel=0" type="application/x-shockwave-flash" width="420" height="315" allowscriptaccess="always" allowfullscreen="true"></embed></object>

</body> </html>

New:

<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>My Page</title> </head> <body> <iframe width="420" height="315" src="//www.youtube.com/embed/_OBlgSz8sSM?rel=0" frameborder="0" allowfullscreen></iframe>

</body> </html>

Ugh, not sure why it isn't showing, I am a noob and not familiar with Markdown so maybe that's the problem... either way if there's some sort of known issue regarding my current problem a response would be greatly appreciated.

2 Answers

Christine Villa
Christine Villa
5,273 Points

Have you tried adding "http:" to your source? for example:

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

Hopefully that works for you!

Christine Villa
Christine Villa
5,273 Points

For some strange reason my post didn't accept the code I put in. But what I meant was after the "src" in

src="//www.youtube.com/embed/etc..." post "http:"

that way it reads

src="http://www.youtube.com/embed/etc..."

Tyler Anyan
Tyler Anyan
2,976 Points

Thanks for the reply, I will try that as soon as I have the time to revisit the lesson. One thing I did find was that the conflict definitely has something to do with shockwave flash. When I disable it from plugins the video box loads just fine (but of course won't play because it needs flash to play). When it is enabled nothing happens at all. I've made sure I have the most recent update of both flash and firefox so I'm not entirely sure how to approach the issue unless I try and go back to an earlier version of flash (just started using Ubuntu and right now only have firefox loaded as a browser, once I get one or two others loaded I can check to see if it's browser specific). Anyway, thanks again, I will try your suggestion and see if it helps.