How to Allow WebP Upload in WordPress (Without Plugin)

Updated: December 24, 2020

If you want to save the storage space on your server, using the WebP format every time you want to upload an image is a reasonable reason. An image with the extension of .webp is 25% smaller in size than other formats like JPG and PNG. Unfortunately, by default, you can’t upload a WebP image in WordPress. The reason is that the format is not supported by WordPress yet. According to the error message when you are attempting to upload a WebP image, the reason why WordPress doesn’t support the WebP format yet is due to a security reason. If you are pretty sure that the WebP images won’t harm your site and you want to allow WebP upload on your WordPress site, this article will show you how.

As said above, the reason why you can’t upload an image with an extension of .webp is that the image extension is not supported by WordPress. That being said, you can add a new function to add the .webp extension to the allowed extensions list.

How to Allow WebP Upload in WordPress

To add the new function, you can edit the functions.php file of the theme you use. Before doing so, we recommend you to make the backup of the file first just in case everything doesn’t go the way you expected.

Once you are ready, login to your WordPress dashboard and go to Appearance -> Theme Editor. Select the functions.php file on the right panel to edit it.

Add the following code to the file. You can place the code in the end section of the file. Here an example of the code placement. Don’t forget to click the Update File button after adding the code.

//enable upload for webp image files.
function webp_upload_mimes($existing_mimes) {
    $existing_mimes['webp'] = 'image/webp';
    return $existing_mimes;
}
add_filter('mime_types', 'webp_upload_mimes');

//enable preview / thumbnail for webp image files.
function webp_is_displayable($result, $path) {
    if ($result === false) {
        $displayable_image_types = array( IMAGETYPE_WEBP );
        $info = @getimagesize( $path );

        if (empty($info)) {
            $result = false;
        } elseif (!in_array($info[2], $displayable_image_types)) {
            $result = false;
        } else {
            $result = true;
        }
    }

    return $result;
}
add_filter('file_is_displayable_image', 'webp_is_displayable', 10, 2);

From now on, you should be able to upload a WebP image to your WordPress site. If you want to re-disallow the WebP upload, you can simply remove the function from the functions.php file.

This page may contain affiliate links, which help support utilizeWP.

Boost your site speed with the best caching plugin in the world

Leave a Reply

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

Share This