Converting PrestaShop Images to WebP

Following on from my image cleanup tool, I’ve been looking at ways to speed up PrestaShop sites without touching the theme or installing heavy modules. The obvious target? Images.

Product images are usually the biggest chunk of any e-commerce page. On a typical category page with 20 products, you’re easily loading several megabytes of JPEGs. Multiply that across thousands of visitors and it adds up quickly — both for page speed and bandwidth costs.

Why WebP?

WebP has been around for years now, and browser support is essentially universal at this point. The format typically delivers 25-35% smaller file sizes compared to JPEG at the same visual quality. For a store with 10,000 product images, that’s a significant reduction in what visitors have to download.

The catch is that PrestaShop doesn’t support WebP natively. You can’t just upload WebP images through the back office. The regeneration tools only output JPEG and PNG.

What I Built

Rather than mess about with core files or install modules that hook into the image generation process, I went for a simpler approach.

The tool converts your existing product images to WebP format, placing the new files alongside the originals. Then it adds some rewrite rules to your .htaccess that automatically serve the WebP version to browsers that support it. Browsers that don’t? They get the original JPEG or PNG.

Your image URLs don’t change. The product pages don’t change. The swap happens at the server level, completely transparent to both PrestaShop and your visitors.

How It Works

  1. Upload the PHP file to your PrestaShop root
  2. Change the default password
  3. Run a scan to see what you’ve got
  4. Preview with a dry-run
  5. Convert your images
  6. Add the .htaccess rules (creates a file in /img/p/)
  7. Delete the tool when you’re done

The conversion runs in batches so it doesn’t time out on larger catalogues. You get a live progress log showing what’s being converted and how much space you’re saving.

If you change your mind later, there’s a full revert option. It’ll delete all the WebP files and remove the .htaccess rules, putting everything back to how it was.

The .htaccess Bit

This took a bit of figuring out. PrestaShop’s main .htaccess does URL rewriting for friendly image URLs — and those rules have [L] flags that stop processing before any WebP rules at the bottom would be reached.

The solution is to place the WebP rules in a separate .htaccess file inside /img/p/. This gets processed when Apache actually goes to serve the file, after PrestaShop’s URL rewriting has already done its job.

The rules check the browser’s Accept header for image/webp. If the browser supports it and a WebP version of the requested file exists, it serves that instead. If either condition fails, the original file gets sent.

It also adds a Vary header so caching proxies know to store both versions. Your main .htaccess stays completely untouched.

It’s Free

I’ve put it on GitHub alongside the cleanup tool. Same MIT licence, same deal — use it however you like.

GitHub: PrestaShop WebP Converter

As always, back up before you start. The tool preserves your original images, so the risk is minimal, but it’s still modifying your .htaccess file. Better to have a backup and not need it.

Results

On a test site with around 8,000 product images totalling 2.3GB, the WebP conversion brought that down to about 1.6GB — roughly a 30% reduction. Page weight on category pages dropped noticeably, and the Lighthouse performance score went up a few points without any other changes.

If you’re looking for a quick win on site speed without diving into theme optimisation, this might be worth a look.

Have a similar project?

Let's discuss how I can help.

Get in Touch

Enjoyed this post?

Subscribe to get notified when I publish new articles and project updates.

Leave a Comment

Your email address will not be published. Required fields are marked *