Tech fixes and hacks • DiGiztal

✔Last Updated: October 2023

Find out how to convert Blogger images to webP format with this easy-to-follow guide.

NOTE: Now Blogger accepts images in webP format. You do not have to do what I show you below. Just convert your image to webP format online at Online Convert site.

This is another useful how-to from DiGiztal Blogspot Blogger Tips series.

You can serve Images In Next-gen Formats in Blogger blog, to improve your Blogger blog speed.

webP is an image format uses both lossy and lossless image compression.

WebP is an image format optimizes compression better than JPG and PNG.

When you check your Blogger blog post speed with Google PageSpeed Insights, you see a similar remark like this:

Serve images in next-gen formats 0.75 s

I know many of you Blogger publishers are facing this technical problem.

Blogger new interface is not supporting to upload a webp images.

In other words, you are unable to upload webp images to your Blogger/Blogspot site.

When you try to upload a webP image to your Blogger site, you will see this error:

In short, you cannot upload a webP format image to your Blogger site.

Don't give up, wait:

There is a workable way to overcome or fix this problem.

Keep reading...

To serve webP images in Blogger, you still upload your images as usual in JPEG or PNG formats.

Then you go to the "HTML view" of the blog post to make changes to images code.

If you want to make changes to all your past blog posts, you have to make amend to each one at a time.

Yes, I know it is a daunting task, to say the least.

Probably for the start, you just make changes to those popular posts and the newly published ones.

When you have the time, then you go through all the rest of your old blog posts.

I would be showing you how to convert or alter blog posts images and also the header image to WebP format.

Convert Blogger images to webP format

This is how you do it:

STEP 1: Locate Image Code

1. Log into your Blogger Dashboard.

2. Click your blog post which you want to change the JPEG or PNG format to webP.

3. Next click the pencil icon on the left hand side of the post editor.

4. Then click "HTML view".

Then look for the image code, which looks something like this:

STEP 2: Look for s1600 in image code

1. Look for this "s1600".

2. There are two of them in there (highlighted in yellow).

3. Just after s1600, add -rw.

4. This is what it looks like after the changes:

NOTE: Some of you might not have “s1600”. You may see codes like: “s200”, “s320”, “s400”, “s640” or some other digits.

5. You just add “-rw” after any of these codes.

6. After adding the -rw, click the "Update" button.

7. Now, let's find out how to change your Blogger header image from JPEG or PNG to WEBP format.

Change Blogger header image to webP format

1. Log into Blogger Dashboard.

2. Click "Theme".

3. Click the white reversed triangle next to CUSTOMIZE button.

4. A menu appears.

Click "Edit HTML".

5. Now search for this code:

<b:widget-setting name='displayUrl'>

6. Look for the URL followed from the above code.

7. The whole line looks something like this:

<b:widget-setting name='displayUrl'>https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnH7Dfc40E57UrCizAl86Tm6B2QJyGXSQ0JTvx__VsfUBWbHyW2Tkn-jebvb1_hIDcaMZk5ktIFPuYz-Xf2gZgA94l-4aFDR69AmLwhYc5NX5UPVnDyV3s12UPowmNIVAm5VbixSaIyuU/w400-h128/</b:widget-setting>

8. Add -rw at the end of the code.

9. Now it should look like this:

NOTE: You code should look slightly different from my example.

10. Then click the "Save" icon (floppy disk symbol) on the top right hand corner.

That's all you need to do.

Check Blogger images webP format

Now, go to Google PageSpeed Insights site to check whether you still have that serve images in "next-gen format" remark.

1. To check whether the image is now in WebP format, you just right click the image, then click "Save Image As..."

2. When the box pops up, you can see, the image in WebP in both:

"File name:" and "Save as type:"

3. Similarly, you can right click the image, then click "View Image Info".

4. Click "General" and below you can see "Type: image/webp".

5. Or you can click "Media", then click the image URL inside the "Address" box.

6. Look below and you can see the remark, "Type: WEBP Image".

That's is how you can change your Blogger images format from Jpeg or Png to webP.

February 25, 2021

How to convert Blogger images to webP format