If you have a TypePad blog and want to add/embed a YouTube video into a post, you’re going to have to do a bit of under-the-hood work. Don’t worry! It’s not as tough as it sounds.
Here’s the step-by-step process of embedding a YouTube video into a TypePad blog, even if the YouTube video is too wide.
Step 1: Create your TypePad post. When you’re ready to embed the video type in a place holder where you want the video to go. I use “xxx” but you can say “video goes here.”
Step 2: Go to YouTube and find the video you want to embed. To the right of the movie you’ll find some HTML code under the word Embed. Copy this code.
Step 3: Return to your blog post. Click on the Edit HTML tab above the post box.
If you’re not an HTML jockey you may find this intimidating. Don’t worry. Find the “xxx” or “video goes here” in the code. Replace it with the embed code from the YouTube video. If you click back to Compose Post and you don’t see your video, don’t worry, it’s there. Finish up your post and hit publish, then go check out your work…you’re done!
Dealing with Wide Videos in a Narrow Column
Unless, of course, your video looks like this:
Where the video is wider than the blog column. Many people don’t care about this, but if you’re anal like I am, you want everything to fit nicely. If so, you’re going to need to take a few extra steps.
Extra Step 1: Determine how wide your column width is. There’s probably a few different ways to doing this. One would be to get a microscope and count each pixel. Probably not the best use of your time or your eyesight.
On Macs you can command-shift-4 and do a screen capture of the width of the column. On newer Macs as you click and drag the cursor over the column it will tell you how many pixels wide your selection is. If it doesn’t, you can take a screen capture of the column, open it in Preview, hit command-i and get the info for that document, including it’s width. That’s the width you’re playing with.
If you’re on a Windows machine, go to your local Apple Store and pick up a Mac.
Extra Step 2: View the source code of your movie embed. Do this by again clicking on Edit HTML in the top right corner of the post window. Scroll down and look for code like this:
<object width=”425″ height=”344″>
You’ll need to change the width and height. If you’re like me–mathematically challenged–you may hurt your head trying to do the math. Instead, do this. Create a new image in Photoshop (or other image editing program) that’s 425 x 344 and resize it to your width, say 396. That will give you the new correct height as well, in this case 321.
There are TWO places in the embed code that need to be updated. Make sure you make changes to both.
Extra Step 3: Write down the correct width and height somewhere so you don’t have to go through this again. Then you’ll have a YouTube video perfectly formatted for your blog and your visitors. Enjoy!
https://www.youtube.com/watch?v=9fK4YQDfxuM
