BLOGGER TUTORIAL - How to resize photos on blogger


CLICK HERE FOR THE NEW 'GARDEN OF EADEN' WEBSITE AND SEED SHOP

Blogger has recently changed the editing program they use for producing posts, so the once simple 'drag and pull' system or re-sizing you photographs has now gone for ever. Instead it has been replaced by some awfull set up that that refuses to do what you want it to do.

However, I have mastered its idiosyncracies and am willing to pass on the information.

1. You CANNOT click and drag you photos anymore. Don't try, even though it may look as though it may work - it won't! When down loading a new photo it will only sit where you left your curser so make sure you have clicked in the place before you down load it.

2. You new image will always start off in the centre of the post - however annoying that may be, but click on the photo and it will give a list of options just below it. As I prefer my main photos to fill the full length of my post I choose to click on the left option, then increase the size to large. Usually the X- Large option will too big and will remove one end of your photo.

3. For a perfect fit I am afraid you will need to edit the HTML code of your photo, but it is very easy once you know what to look for. Firstly click onto the Edit HTML tab on the top right of where you are writing your post then identify the code that represents you photo. It should look a little like this:

<div class="separator" style="clear: both; text-align: center;">
<a href="http://4.bp.blogspot.com/-kBGdvOLmzWY/TaBRseKsvDI/AAAAAAAADUQ/MfnnkGniCdM/s1600/image captions blogger.jpg" imageanchor="1" style="clear: left; cssfloat: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="275" r6="true" src="http://4.bp.blogspot.com/-kBGdvOLmzWY/TaBRseKsvDI/AAAAAAAADUQ/MfnnkGniCdM/s400/image captions blogger.jpg" width="325" /></a></div>

Luckily this code will allow you to adjust the size of the photo. The key features you are looking for are in this area of the code isolated below, noteably where it says height="275" and width="325" :

img border="0" height="275" r6="true" src="http://4.bp.blogspot.com/-kBGdvOLmzWY/TaBRseKsvDI/AAAAAAAADUQ/MfnnkGniCdM/s400/image captions blogger.jpg" width="325" /></a></div>

All you have to do is change the numerical values for height and width so that it fits as per your wishes.For my own posts, I usually keep values of height="400" and width="500", however you will need to play with it a little to find out what fits your posts exactly.

For related articles click onto:
BLOGGER TUTORIAL - How to add another page element (Add a Gadget)
BLOGGER TUTORIAL - How to add a live traffic feed to blogger
Can't get past 'Welcome' screen - Windows 7?
How to Create a Google Account
How to Create a Hyperlink on Blogger
How to get past being stuck on the 'Welcome' screen using Windows 7

Image care of - http://www.bloggersentral.com/

5 comments:

Kelly Mulcair Registered Nutritionist. Content © 2011 Trinity Nutrition. said...

Thank you so much for this post - I've been fiddling around for days trying to figure out how to do this! Your explanation was so useful. Much appreciated.

Rotten Nuke said...

Thanks for this info. Haha. I know I suck in blogging but I needed to know this. Such a help. ;)


rottennuke.blogspot.com

Emine said...

when i change the html for the images sizes, the picture will stretch as opposed to re-size, its so annoying.

Jake Fake said...

An easier solution would be to resize your images before uploading. There are a few tools online to do this but I prefer http://imageresize.qweb.co.uk. Just give it an image, or a zip containing multiple images, tell it the size you want and pick a resize mode. Simples!

It does put a watermark in the lower right of the image if you use the free version, but you can get rid of this if you register an account.

sharon staudigel said...

OMG I have been trying for a WEEK to fix this problem. Blogger help was useless, but your solution works!!! Thank you!!!!