This commercial always makes me giggle but the overhanging embedded video above is rotten right? Today I'll teach you how to fit youtube videos perfectly to your blog so they'll never overhang again! [proper video width shown at the bottom]
*
1. What is the center column width of your blog? (mine is 400)
To figure out the width of your blogs center column, right click on one of your landscape photos, then click 'properties' or 'view image info'. The first number in your dimensions is the max width.
(Sidebar: As long as you don't have a custom-coded blog layout, your center column is probably 400 and your landscape photos will load at a 'medium' format. Instead, select 'large' so that it fills the blogs ideal column width)
*
2. Now 'copy' the embedded code from the Youtube video.
*
3. 'Paste' the Youtube code into a blog post. Then open a new canvas in Photoshop (file>new) and pop in the dimensions found in the Youtube code (see the highlighted 480...385 in my code to locate where yours are). A blank canvas will pop up in Photoshop.
*
4. Now we'll shrink that canvas to figure out the new width & height for your video code. Go to 'Image Size' in Photoshop (Image>Image Size) and enter your blogs' center column width (from step 1) into the width box. The height will automatically adjust/scale and now you have the correct ratio for your Youtube video (that will fit perfectly)!
*
5. Using the new dimensions, replace the width & height into the code on your blog (see the 2 bolded spots above). The width goes first, then the height. Save your blog post and go back into it and the code will've turned into the video preview (or you can switch the 'edit html' tab and back to the 'compose' tab to achieve the same transformation).
Publish and you're done :)
*
BONUS! Learn how to size portrait photos to the perfect width on Blogger.
YouTube lets you choose your height and/or width when you click . Just under the color chooser, you can choose from four sizes or enter your custom size.
ReplyDeleteYou don't need to edit the html code yourself, it does it for you.
Does that not show on YouTube for you?
Is there a way to just widen your column in Blogger do you know?
ReplyDeleteThanks, I had this trouble the other day with a video I posted, it is huge and takes up most of my layout! I hope you have a lovely day LA!
ReplyDeletexoxo~Meg
thanks for this!!! I always wondered how to do it!!!!! I am loving your blog by the way! Officially added to the blog sidebar!!!! :-)
ReplyDeletewww.katyplayinghouse.blogspot.com
better yet...if you go back to step 2...you can edit it as well as the colour on youtube and it will update the code for you :)
ReplyDeletecurious why you don't just change it in youtube? there is an option for that...
ReplyDeleteThis is very timely! I frequently end up cutting off a side of the video. Erg!!
ReplyDeleteI'll try your tips.