WebP is a modern image format that provides superior compression and faster loading times compared to other image formats like JPEG and PNG. If you want to use WebP images on your Joomla 4 website, you need to make sure that your website supports this format. In this guide, we'll show you how to add .webp image type support in Joomla 4.

Step 1: Check if Your Server Supports WebP

Before you can add .webp image type support to your Joomla 4 website, you need to make sure that your server supports this format. You can check this by creating a PHP file with the following code:

<?php
echo function_exists('imagewebp') ? 'WebP is supported' : 'WebP is not supported';
?>

Save the file as webp-support.php and upload it to your server. Then, open the file in your web browser by going to http://yourdomain.com/webp-support.php. If you see the message "WebP is supported", then your server supports WebP.

Step 2: Add MIME Type for WebP

If your server supports WebP, the next step is to add the MIME type for this format in Joomla 4. This tells your server how to handle .webp files. You can add the MIME type by following these steps:

  1. Log in to your Joomla 4 backend.
  2. Go to System > Global Configuration > Server.
  3. Under the Server Settings section, find the "MIME Settings" option.
  4. Click on the "New" button to add a new MIME type.
  5. In the "MIME Type" field, enter image/webp.
  6. In the "File Extension" field, enter .webp.
  7. Click on the "Save & Close" button.

Step 3: Use WebP Images on Your Joomla 4 Website

Once you've added .webp image type support to your Joomla 4 website, you can start using WebP images. You can create WebP images by converting your existing images to this format using an image converter tool. There are many free online tools that you can use for this purpose.

To use WebP images on your Joomla 4 website, simply replace the file extension of your image from .jpg or .png to .webp. For example, if you have an image called image.jpg, you can convert it to WebP and rename it as image.webp. Then, update the image source in your HTML code to point to the new WebP image file.

By following these steps, you can easily add .webp image type support in Joomla 4 and start using WebP images on your website.