How to Automatically Resize Images In Blogger – Tecky Tuesday

How to Automatically Resize Images In Blogger

How to Automatically Resize Images In Blogger

This weeks Tecky Tuesday will show you a really simple way that you can automatically resize the images in your posts if you are using blogger! This really simple tutorial will show you how to make all your images in your blog posts the same width so that they fit your template perfectly. The way these changes work is that your width will be fixed whilst the height of the images will be automatically altered. This will make sure that any images you have in your posts wont look distorted!

Its one of my pet hates going on blogs that have been around a while, and looking at earlier posts and the images don’t match up with the theme anymore. This tutorial will show some really simple css that will resize any image that is in the post area of the blog!
Let me know how this works out for you in the comments below!

Note: I personally always upload correctly scaled images, meaning if I know a post is 634 across I upload my images at that resolution. My reason for this is that I am always on the look at trying to get the site to load as fast as possible. Using this method you just have to make sure that everything is posted above that resolution.

Step 1 – Backup your template, it is as easy as going to Template> Edit HTML/CSS and copying everything into a text document. If you have any issues just copy that back in to blogger and you will be back to where you started!

Resize Blogger Images Using Simple CSS

Step 2 – Go to Template > Customise > Advanced > Edit CSS.
Adding anything into this part of the code will add it into your Template CSS section automatically.

[css].post-body img { width:500px; height:auto; }[/css] Change the green number after “width” in order for it to fit your blog correctly.

Let me know if you find this useful by posting in the comments below or by Sharing / Liking on social media to anyone that you think might find this useful. Let me know if this guide on how to automatically resize images in blogger is working for you.

Share:

7 Comments

  1. Sophie Elizabeth Grace
    2014/07/15 / 16:02

    Thank you, Mary! I’ve been manually editing the html for donkey’s now, glad to have this little tip in my life! x

  2. Mariah
    2014/07/15 / 22:37

    Such a simple solution for a common problem! I hope everyone sees this!

    Theatricality by Mariah

  3. 2014/07/18 / 02:11

    Just tried it & it worked! Thanks so much!

Leave a Reply

Your email address will not be published. Required fields are marked *