Converting images into WebP files using PHP.

In this tutorial, we are going to show you how to convert JPEG and PNG files into WebP images using PHP.

As you’re probably already aware, WebP is a superior web format to both JPEG and PNG. This is because it can create smaller file sizes with the exact same image quality.

Converting JPEG into WebP using PHP.

To convert a JPEG image into a WebP image, you can use the following piece of code.

//The file path of your image.
$imagePath = 'dog.jpg';

//Create an image object.
$im = imagecreatefromjpeg($imagePath);

//The path that we want to save our webp file to.
$newImagePath = str_replace("jpg", "webp", $imagePath);

//Quality of the new webp image. 1-100.
//Reduce this to decrease the file size.
$quality = 100;

//Create the webp image.
imagewebp($im, $newImagePath, $quality);

In the example above, we took the following steps.

  1. We specify the file path of the original JPEG image that we want to convert.
  2. After that, we create an image object of the old file by using the imagecreatefromjpeg function.
  3. We then define the path and filename that we want to use for our new WebP image. In this case, we are using the exact same path. However, we are replacing the “jpg” extension with “webp”. Note that you may need to change this line to suit your own needs.
  4. We set the quality to 100. If you need to compress the image further, then you can reduce this number.
  5. Finally, we created a new WebP version of the image by using the imagewebp function.

Converting PNG files into WebP.

To convert a PNG image into the WebP format, we can modify the example above.

In this case, we will need to change the name of the extension and how we create the image object.

Simply put, this means changing “jpg” to “png” and using the imagecreatefrompng function instead of  imagecreatefromjpeg.

//The path to your PNG file.
$imagePath = 'dog.png';

//Create an image object.
$im = imagecreatefrompng($imagePath);

//Replace "png" with "webp".
$newImagePath = str_replace("png", "webp", $imagePath);

//Quality. 1-100.
$quality = 100;

//Create the webp image.
imagewebp($im, $newImagePath, $quality);

This will also work for other formats. For example, if you need to convert a GIF file, then you can use PHP’s imagecreatefromgif function.

Displaying WebP images on-the-fly.

If we want to convert our image and display it “on-the-fly” instead of creating a new file, then we will need to change the final part of the code.

//The quality of our new webp image. 1-100.
$quality = 100;

//Set the content-type
header('Content-Type: image/webp');

//Display the image in the browser by setting the second parameter to NULL.
imagewebp($im, null, $quality);

//Clean up / Destroy the image object.
imagedestroy($im);

If you use the PHP code above, then you will notice that the converted image is displayed directly in the browser. This is because we specified the Content-Type header and then set the second parameter of imagewebp to null.