How to 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, 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!


How to install a Scroll To Top button

how to scroll to top button


Install this plugin – WPFront Scroll Top

It’s what I use on this blog!


Here’s your hack:

1. Log on to your Blogger blog, go to Template > Edit HTML > search for the <head> tag > just below/after the <head> tag place this bit of code:

<script src=''></script>

* you may already have a jquery script in your blog’s template, possibly for something to do with Pinterest – take a look at the first few lines of code to determine if you already have it – if you do there is no need to add it again… skip ahead to #2.

Save template.

2. Now go to Layout > click Add a Gadget > select an HTML/Javascript > copy and paste the code below into the content section:

<!--Smooth Back to Top Button Start-->
jQuery(document).ready(function() {
var offset = 220;
var duration = 500;
jQuery(window).scroll(function() {
if (jQuery(this).scrollTop() > offset) {
} else {
jQuery('.back-to-top').click(function(event) {
jQuery('html, body').animate({scrollTop: 0}, duration);
return false;
div#page {
max-width: 900px;
margin-left: auto;
margin-right: auto;
padding: 20px;
.back-to-top {
position: fixed;
bottom: 2em;
right: 0px;
text-decoration: none;
color: #000000;
font-size: 12px;
padding: 1em;
display: none;
.back-to-top:hover {
text-decoration: none;
<a href="#" class="back-to-top"><img src="" alt="Back to Top" / ></a>
<!--Smooth Back to Top Button End-->

You can either use my default “back to top” button, which is the URL highlighted in red, or you can replace it with your own.


Happy blogging!


The Outlander Series


Are you a fan of Diana Gabaldon’s Outlander series?

I am.

It was one of the first book series that I got hooked on. The books take you from England to Scotland to America and beyond. A little bit of supernatural here, lots of history there, and romance and adventure everywhere, what’s not to love?

Now it’s going to be a television series on Starz. It debuts in the U.S. in a couple of days, August 9th – I already have my DVR set, but Starz already has the first episode up on YouTube – and of course I’ve watched it -

and it’s fantastic.

Have you read the Outlander series?

UPDATED: Only one episode of the time-traveling bodice ripper that is Outlander has actually aired on the Starz network so far, but the show’s definitely coming back for another season. The first episode of the series reportedly got 5 million views on multiple platforms, including online.