Keep Your Images From Taking Over Your Blog!

This post was published 6 years ago. Some things may have changed since then - use the search function to see if anything has been posted since then, or reach out to us on Twitter if you'd like to see a more updated post!

“A picture is worth a thousand words” or so goes the old saying. Depending on the type of blog that you write, you’ll need decent photos to illustrate what you’re talking about – it’s difficult to talk about a lipstick without showing a photo of it if you’re a beauty blogger. One of the things that will put people off a blog is images that are too small so you can’t see what they are, but perhaps a little confusingly, images that are too large are annoying as well – so how do you make sure that your images are all the same size but still look good?

The first method, applicable to everyone no matter what your platform is, means making your images all the same width when you edit them. If you’re using PicMonkey, just click the Crop button, input your chosen image size, and then check the “Scale Photo” button and then resize the crop image outline. When you click the crop button, the image will be cropped to how you want it, but the size will be fixed as whatever you set it as!

The next method involves a little bit of code if you’re a Blogger user, but it’s pretty simple. You’ll need to know the width of your content column (the bit where your blog text is) to figure out what the maximum your image should be. Head to your Blogger dashboard and go to the template editing section. It looks like this:



Search for </b:style> or </style> in the Template section, and paste this bit of CSS in above it:

.blog img {
max-width: 500px

Change the 500 to however many pixels your column width is. You can add in other items to this like adding a border to your images. This bit of CSS will only resize images down – it won’t stretch out smaller images.

(For more details about the different tags available to you in Blogger, visit this Blogger help article)

If you’re a WordPress user, then it already does most of the resizing for you when you upload a large image, but you can set the width and/or height by going to Settings > Media.

Have any tips to share on this?

  • Alexandra Carus Bowker

    With regard to uploading images to WordPress –

    **Resize images BEFORE you upload them to the Media Library, as it uploads the original size – this means that even though you can chose which size to add to your posts, it still retains the original size when your pages are loading. This will ultimately make your site really slow.

    There are plugins which are meant to automatically amend the image size for you as you upload them, though I haven’t tried them to be able to say sorry.

    January 16, 2014 at 9:38 pm Reply

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.

%d bloggers like this: