15 Hacks for Blogger Images, I Bet You Don’t Know About It

Images are the most important part of publishing a post on the web. An image speaks 100 words. Image defines any concept in less time than it is required for a paragraph. And every publisher takes the advantage of adding images to every blog page.
Blogger image hacks
Blogger users used to search about how to set the width and height of an image using HTML? How do I change the width of an image in a URL? How do I change the size of an image in HTML URL? How do you specify the width and height of the image? How can I get the image width and height from the URL?

Today here, I am going to talk about the new ways of adding images to your Blogger Blogspot. Most bloggers specially those who use “Blogspot” as their blogging platform and used to use HTML and CSS (Cascade Style Sheet) to set the height, width of the images added to posts. But have no idea that they can set their image height, width, border, crop, etc only by changing the blogger image permalink.

To control layout shifts and improve performance, PageSpeed scores, you require to always assign width and height attributes to your images. You can resize the image by defining the width and height of the image by URL. If height and width are specified, the space needed for the image is preserved while the page is loaded. When you select both height and width, the image is forced to fit the requested proportions. It could change the original aspect ratio. Check new tricks and hacks you can use with the image URL to assign new height, width, border, and much more.
Blogger Image Hacks
Blogger Image Hacks
{tocify} $title={Table of Contents}

How to Automatically Resize, Fit, Scale, Crop, Align & Assign Border to Any Image Using Only URL Parameters

If you're using the BlogSpot by blogger, you can programmatically load the image from the web and call its dimensions. Using dynamic image resizing, You can easily resize images via URL.

Blogger Image Hacks:

1. Default Image

First check URL Structure of Blogger Image. If you upload an image to blogger, by default it automatically add s1600 to its permalink, it look like this:
So the image will looks alike:
Blogger Image Hacks
Blogger default image URL link

2. Set Custom Size

You can replace s1600 from default image URL and try to set any size as you like; for example s480, s720 or s1080 as your wish.
So the image will looks alike:
Set Custom Size of The Image Using Url
Set Custom Size of The Image Using Url

3. Set Max Resolution of the Image

You can edit the image URL to set the max resolution of an image up to s2650 in blogger.

4. Crop the Image Using URL

Replace s1600 to s500-c in image url, you will get image as square; that means its height and width will be exactly 500px. You can also use s300-p to crop the image.
So the image will looks alike:
Crop the image using URL
Crop the image using URL

5. Add Border to The Image.

Replace s1600 to s1600-b8 in image url, you will get 8px black color border with the image. I have tried maximum to b30 but you can try more.
So the image will looks alike:
Add Border to The Image Using URL
Add Border to The Image Using URL

6. Download Link for the Image

Replace s1600 to s1600-d in image url, you will get provide a download link for image.
You can use such a link to provide downloading option for any perticular image or photo from your blog page for your readers. This hack is mostly helpful for photography bloggers.

7. Original Image

Replace s1600 to s0 in image URL, you will get original version of an image that you have uploaded.

8. XML Image Object

Replace s1600 to s1600-g in image URL, you will get XML object code of an image.
This trick is mostly useful for developing people, looking to know code working structure.

9. Set Custom Width

Replace s1600 to w320 in image URL and image width didn't go beyond 320px. Yes you can also try any other size as your need.
So the image will looks alike:
Set custom width of an image using URL
Set custom width of an image using URL

10. set Custom Height

Replace s1600 to h320 in image and image height didn't go beyond 320px.
So the image will looks alike:
Set custom height of an image using URL
Set custom height of an image using URL

11. Set Custom Width and Height

Replace s1600 to w320-h240 in image URL, it give size in frame of width of 320px and height of 240px.
So the image will looks alike:
Set custom width and height of an image using URL
Set custom width and height of an image using URL

12. Set Custom Size and Width

Replace s1600 to s500-w320 in image URL, it give maximum width of 320px.

13. Set Custom Size and Height

Replace s1600 to s500-h240 in image URL, it give maximum height of 240px.

14. Set Custom Size, Height and Width

Replace s1600 to s600-w310-h240 in image URL and just check it out.

15. No Thumbnail Appear

Replace s1600 to s1600-m1 in image url, you will get thumbnail of error image sample.
So the image will looks alike:
No thumbnail image preview using URL
No thumbnail image preview using URL

As far as I know, if you like to change the image according to the query string, I recommend you could try to use these techniques to set the image width or height in the image URL itself.

Enjoyed these hacks, let me know what you think. And comment below if you have other tricks regarding bloggers. You can also use these tricks in Google Plus, Picasa, or any other Google service.

Also dont forget to check; Enable Lazy-Loading Images on Blogger Website To Speed up Loading By 2X

If you enjoyed this article, please share it with your friends and help us spread the word.

Next Post Previous Post
No Comment
Add Comment
comment url
But before you read the page, I just want to tell you that; you can now convert every visitor & every impression in $$$ with the most advanced & reliable monetization platform that having highest fill rate & the best payouts in the industry.
ADTR Network

One day approval. Monetize your traffic from day 1, with 100% fill rates, higher CPM, & quick payouts. Register to Start Earning Right Now →

ADTR Network

New AI-Powered Content Marketing Toolkit
Rated 5/5 stars in 10,000+ reviews. Stay ahead of the competition with next-gen tech adoption by optimizing content for the target audience to drive 3x faster results. Act now to gain a competitive edge in the market.


Improve Revenue, Performance,
Grow Traffic Faster

Join Adsense Certified Ad Partner
"ADTR is a must have automatic testing tool for serious publishers."
300% Rise
in AdSense Earnings
Get results from Day 1
Read The Case Study


We are one of the type of a professional review site that operate like any other website on the internet. We respect & trust our readers. And we are confident & would like to mention that the above post contains some affiliate/referral links. And if you make a purchase; we receive commission from the links/apps/products we refer. We are totally unbiased and do not accept paid reviews or fake reviews claiming to be something they are not. We test each product thoroughly and give high marks to only the very best. We are independently owned and the opinions expressed here are our own.

Privacy Policy

All of the ProBlogBooster ideas are free for any type of personal or commercial use. All I ask is to keep the footer links intact which provides due credit to its authors. From time to time, we may use visitors/readers, information for distinct & upcoming, unanticipated uses not earlier disclosed in our privacy notice. If collected data or information practices changed or improved at some time in the future, we would post all the policy changes to our website to notify you of these changes, and we will use for these new purposes only data collected from the time of the policy change forward. If you are concerned about how your information is used, you should check back our website policy pages periodically. For more about this just read out; Privacy Policy