Thursday, February 14, 2008

Embedding YouTube Video in Blogger

For next week, you will need to embed a YouTube version of your video in your blog. There are a couple of ways to do this. The first is to use the built in video player in Blogger that you can find when you are using the customize blog option. This will pop the video up at the top of your blog when the user plays it. The problem is that this may not be what you want to do, and for the purposes of this class, is not the way I want you to embed the video.

A second option is to use the embed code that YouTube gives you, which looks something like this:

<object height="355" width="425"><param name="movie" value="http://www.youtube.com/v/wuZc8B9AdFw&amp;rel=1"><param name="wmode" value="transparent"><embed src="http://www.youtube.com/v/wuZc8B9AdFw&amp;rel=1" type="application/x-shockwave-flash" wmode="transparent" height="355" width="425"></embed></object>

It comes out looking like this:









Here's the problem with that, while it works well for the main blog (and you want to make sure you copy it into your blog entry in HTML mode), it does not work well in a sidebar where you need a smaller version. Here's another video (it's on the right hand bar as well), with the code modified--I cut all the dimensions in half. Note that you have to tweak the numbers in the <object> tag and in the <embed> tag. I also added an extra paragraph tag at the beginning to bump the video down a bit and a <center> tag so that the video sits in the center of the page.

<p></p><center><object width="212" height="177"><param value="http://www.youtube.com/v/2Uaw2CdjU3c&rel=1" name="movie"/><param value="transparent" name="wmode"/><embed width="212" src="http://www.youtube.com/v/2Uaw2CdjU3c&rel=1" wmode="transparent" height="177" type="application/x-shockwave-flash"></embed></object> </center>











Handy isn't it? This also means that if you are putting your video podcasts on YouTube you can embed them directly into your blog.

Here's a link to the video

No comments: