Know How To Change Blogger Thumbnail Size In Blogger Images, Posts, & Others

Last Updated on December 16, 2021 by Justin Su

The default size of the thumbnails of the website is not loved by everyone. So if you are one of them then you should follow the below methods to change it.

Some Blogspot website looks vague with default blog thumbnail and this is the reason why people littery changes their theme because they don’t know that they can make it look good by changing blog thumbnail size.

The default blogger thumbnail size is 72x72px.

In this guide article, I will show you have to change the size of the thumbnail and images, in the popular post widget and others.

How to Change Thumbnail Size for the Popular Posts Widget without JavaScript

Follow the below steps.

• Log in to Blogger
• Go to Theme
• Click on EDIT HTML (next to customize button)
• Click on Jump To Widget logo & click on PopularPosts1
• Search for the following codes

<b:widget id='PopularPosts1' locked='false' title='Popular Posts' type='PopularPosts' visible='true'>
    <b:includable id='main'>
    ...
    <b:with value='data:post.featuredImage.isResizable ? resizeImage(data:post.featuredImage, 72, "1:1") : data:post.thumbnail' var='image'>
        <img alt='' border='0' expr:src='data:image'/>
    </b:with>
    ...
    </b:includable>
</b:widget>

• Just change the numbers of width and height
• Click on save

Also Read: How To Make Money From Blogging

OR

Copy and paste the below code to your Header

<script type="text/javascript">
 $(document).ready(function() {$('.PopularPosts img').attr('width', '100%').attr('height', 'auto').attr('src', function(i, src) {return src.replace( 's72-c', 's120-c' );});});
<!-- helparchive.blogspot.com -->
</script>

Change the number according to your needs. Like current value is “s120-c” you can change it to 150 or 100 or anything else.

Also Read: How To Add Facebook Page Button To Your Website

Also Read: All In One RunTime Software Download

Change Custom Thumbnail Size For Post Images

To change the thumbnail sizes for images according to your need follow the below steps.

Go to Theme and open EDIT HTML

Copy below code and paste it in the above closing tag </head>

<script type="text/javascript">
 $(document).ready(function() {$('.post-thumb').attr('src', function(i, src) {return src.replace( 's72-c', 's120-c' );});});
<!-- helparchive.blogspot.com -->
</script>

You can increase or decrease the size by changing the number “s120-c”

Follow us on Instagram, blogger thumbnail size.