How to Resize All Images Automatically in Blogger

How to Resize All Images Automatically in Blogger [photo]
Hey! Now I try to teach you "How to Resize All Images Automatically in Blogger blogs". So! with this article you can easily resize all images in your blogger blogs. This is a common issue in blogger custom templates and also in official ones. Sometimes images will disappoint your blog reader and make your template foolish with crap width. Yes! height does not matter as you width can. So making a good resize level for width of all images in blogger is a key point to clean your template and making good reputation in readers mind.
I personally saw experience this issue with HowToMash while uploading a infographic with a 800px width and it destroyed my post area with foolish image size. Therefore I have searched and find a good code to resize all images in blogger blogs to a limited scale. Read below for more.

Why to Resize all Images in Blogger ?

There are many images with a large number of PX and some of images will not fit in your blogger template. In that case you have to resize all your images. But another headache is resizing images manually will take too much time. If you have 10/20 images then you can but what about thousands of images ? you can't resize them manually. You have to add some CSS coding to do it for you, so can rest.

How To Resize All Images In My Blogger Blog ?

1. Go to blogger.com and login
2. Select your desired blog and go to its Template section
3. Click on Edit HTML and then click anywhere in coding and press Ctrl+F
4. A search bar will appear, now search for this code ]]></b:skin>
5. After finding ]]></b:skin> copy below code and paste above ]]></b:skin>
.post-body img {
max-width: 550px!important;
height: auto!important; }
6. Click on Save Template button and visit your blog NOW.

Customizations

  • If you want to decrease/increase width of all images in your blogger blogs then change 550px with your desired number.
  • Also if you want to limit the height of images in blogger blogs then change auto with your desired number.
  • You can add border to all images just by adding border: 2px solid #dedede to above coding.

Final Words

If you need more help then kindly leave comment. Don't forget to share this article with your friends who have blogs on blogger.com. This is recommended for new blogger template designers, because adding this simple code to your templates a needy process. Enjoy blogging!