Thursday 26 February 2015

How to Automatically Make All post images the same size

how to automatically resize blogger images
One of my favorite sites I bookmark for code snippets was down today (insert curses here) and I was back to square one with finding out how to do something… that something was making all of the images in Blogger posts the same size… with the exception of the Pinterest pin it button – how awful is it when you resize your images and your pin it button is enormous?!?!
Very awful indeed.
So if you ever wondered how to make this happen, here is the code you need to slip in to your template to make all of your images the same width, sans the pin it button:

.post-body img {
max-width: 640px !important;
height: auto !important;
}
.pinit-wrapper img {
max-width: 125px !important;
height: auto !important;
}

If you’re not familiar with the template code the best place to add it would be in Template > Customize > Advanced > scroll down to Add CSS > paste code in the window > Apply to Blog.
Note: for my Blogger templates I use the pin it button code from bloggersentral.com, if your code is from somewhere else the image code may differ, let me know and I’ll slip that code in to the comments for everyone.

*Change the 640px to whatever the width of your blog post is.
*Change the 125px to whatever the width of your pin it button is.
And there you have it!

No comments:

Post a Comment