Have you ever noticed that it's challenging to get your images sizes to be the same width while blogging? And don't you think it's nice when you look at a blog where all the images are the same size? Well I'm going to help you out. Below you will find photo instructions for Blogger, and a bit of quick math for anyone else. Here we go:
First, you need to determine what size (in pixels) you want your images to be. This takes a little trial-and-error where you type in numbers into the HTML code and then Preview the post to see what size you want. My images are always 465 pixels wide.
Unlike the "Small", "Medium", or "Large" options, "Original Size" does not include the pixel dimensions. You will have to add them yourself--and the great thing is that you only need to add the width--the height will be calculated for you!
Click on the "Edit HTML" tab at the top right of the posting box. It will show you a lot of lines of HTML code. For each image, you want to find the <img/> command (highlighted above). Within that line, you can type in the following command: width="465" . I have highlighted it. Spaces don't matter in HTML code, so just make sure you have it within the <img/> line.
Do this for each image, and return to the "Compose" tab. They should all be the same size! Blogger users, you're done!
Now, there may come a time when you will have to calculate your own pixel dimensions (Wordpress, Typepad, Photobucket, etc). For this, there is a simple formula that will maintain the ratio of your image, thus keeping the clarity of your image. Get out your bifocals and pocket protectors, here we go....
If the dimensions of your original image are 500 by 700, but you know you need your width to be 465, all you have to do is find out what your new height will be. To do this, multiply the original height by the desired width, and divide by the original width.
In other words, multiply 500 x 465 and divide by 700. This gives you 332.143, your new height.
Still with me? Once you have the new height and width, all you have to do in your "Edit HTML" tab is insert the command: height="332.143" width="465" within the <img/> line.
I hope this helps! (Feel free to leave a comment below to let me know if this has been helpful or if it's just balls crazy!)