Upload WebP Images in wordpress

In this article, I will show you how you can upload webp images in WordPress. By default, WordPress doesn’t support webp image upload and block this in the media library due to security reasons.

But, you can easily bypass this limitation by using a WordPress plugin or using PHP code in the theme editor.

So, here I will show you both methods where you can easily enable webp upload in the wordpress website.

What is a Webp image and why it is recommended on websites?

Webp is a next-gen image format introduced by Google that provides a better compression rate compared to other formats like JPG, PNG & GIF.

It supports both lossy and lossless compression and provides a high-quality image with maintaining a less file size. In fact, webp image is 26% smaller in file size than the PNG and 25-34% smaller than JPEG.

Webp is now supported in most of the browser like Google chrome, opera, Firefox and Edge browser .

As you know Google introduced the core web vitals as a ranking factor recently and to maintain this you have to optimize your images for faster loading speed.

But the issue is that WordPress doesn’t allow us to upload webp images till now and it is expected to fix this in WordPress 5.8 version.

How to Enable WebP upload in WordPress?

There are two ways you can enable webp upload in WordPress.

Method-1: Using a Plugin

#1: Go to your WordPress dashboard > Plugin > Add new

#2: Now search for “Allow webp” and install the plugin.

Allow webp image WordPress plugin

#3: Click on install now and activate this plugin.

Now webp upload is activated in your WordPress website. But I recommend you to follow the 2nd method as it doesn’t require you to install a plugin.

Method-2: Manual Method ( using PHP code)

To enable webp upload in WordPress you have to add a PHP code in the function.php file of your theme. Just follow the instruction as shown in this video.

YouTube video

Go to Appearance > Theme editor > function.php file

Now paste the below code here and update the file.

function webp_upload_mimes( $existing_mimes ) {
	// add webp to the list of mime types
	$existing_mimes['webp'] = 'image/webp';

	// return the array back to the function with our added mime type
	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);

Now you can easily upload webp images in your WordPress website.

If you don’t want to add this PHP file in your theme editor than you can use a code management plugin in your website.

Just search for code snippet plugin and install it in your WordPress website.

code snippet WordPress plugin

You can also use this plugin to manage all of your PHP codes in your website.

If you have any doubts you can ask me in the comment section and Subscribe to our YouTube channel for more upcoming tutorials like this.

Read Also: How to underline Hyperlinks in WordPress?

Leave a Reply

Your email address will not be published.