How to use webp images with WordPress


By default WordPress does not support webp images. Yet according to Google’s analysis, webp images can help shrink the size of your images by up to 36% thus speeding up every image download. So you probably want to get on that, eh?

The trouble is some browsers, like Apple’s Safari browser, do not support webp so you can’t just replace all your images with webp. Whatever solution you use must serve the webp image files to the browsers that support it, and fall back to other image formats like jpg and png for the browsers that do not. There’s a few different ways to help make this happen, but no matter what you do, you’ll need to use a plugin that converts images to multiple formats. Enter Imagify or ShortPixel our two recommended plugins for handling image conversion.

If you use WP Rocket

So you’ve got WP Rocket (check out our how to speed up WordPress guide) and you’ve got ShortPixel or Imagify to optimize and compress your images.

You might have noticed, both ShortPixel and Imagify have the option to create/convert images to WebP format. Enable that option, but do not enable the option to automatically serve the webp images.

This is because the options within each plugin to deliver those WebP images to the front-end do not always have the desired result. In fact, in some situations, it just doesn’t work at all. Never fear, WP Rocket has an option to play nice with both ShortPixel and Imagify’s WebP images built right in!

Go to your WP Rocket settings, and head over to the Media tab. Scroll to the bottom of the page and you’ll see a setting dedicated to WebP. Click the checkbox there, and WP Rocket will automatically opt to use the converted WebP images when delivering its cached content. Easy peasy!

webp image format compatibility

If you use any other caching plugin

Always check in your cache plugin’s settings first and use *those* settings to enable delivery of webp on the front-end. Only if your cache plugin does not support this functionality should you try using the option for this within your image conversion utility of choice.

If your caching plugin does not support serving webp images

In this case, try using the built-in option in ShortPixel or imagify to serve the images:

  • ShortPixel’s option: Deliver the webp images in the front end
  • Imagify’s option: Display images in webp format on the site

Each one also provides the “picture” option or “rewrites” option. Try out the picture option and if that doesn’t work for you, go for rewrites. Whether <picture> tags work or not will depend on your WordPress theme.

Posted in

Allen Pooley

Allen is a self professed geek and technology lover. He's always playing with one of his various websites, and loves helping customers with theirs. He can often be found with a coffee (light roast, please) in his hand and a smile on his face... or trapped under a pile of yarn.

About Websavers

Websavers provides web services like Canadian WordPress Hosting and VPS Hosting to customers all over the globe, from hometown Halifax, CA to Auckland, NZ.

If this article helped you, our web services surely will as well! We might just be the perfect fit for you.


  1. Zeeshan on December 28, 2022 at 2:23 am

    i am converting images to webp before uploading but when i test in speed test its taking to load 2.2 seconds. what i do for this?

    • Jordan Schelew on January 11, 2023 at 11:07 pm

      Hi Zeeshan, are you referring to the webp images directly taking 2.2 seconds to load each, or the entire page? It sounds to me like the issue could be elsewhere – not the images. Have you seen our guide to optimizing WordPress as a whole? If not, it should help!

Leave a Comment