Automatically implement webp image format upload without plug-ins-WordPress Blog

WordPress  does not support uploading images in WebP format by default. Add the following code to the current theme function template functions.php to solve the upload problem.

function webp_filter_mime_types( $array ) {
 
 $array['webp'] = 'image/webp';
 
return $array;
 
}
 
add_filter( 'mime_types', 'webp_filter_mime_types', 10, 1 );
 
function webp_upload_mimes($existing_mimes) {
 
 $existing_mimes['webp'] = 'image/webp';
 
return $existing_mimes;
 
}
 
add_filter('mime_types', 'webp_upload_mimes');

Although you can upload images in WebP format, you cannot see thumbnails in the media list. This is because when WordPress uses  wp_generate_attachment_metadata()a function to generate image data, it uses file_is_displayable_image()a function to determine whether the file is an image, and the result of determining the WebP image is no. Therefore, the operation of saving the image data is interrupted.The article originates fromSinsTu NI-https://www.sinstu.com/archives/73.html

This function is located at: wp-admin/includes/image.phpThe article originates fromSinsTu NI-https://www.sinstu.com/archives/73.html

function file_is_displayable_image( $path ) {
$displayable_image_types = array( IMAGETYPE_GIF, IMAGETYPE_JPEG, IMAGETYPE_PNG, IMAGETYPE_BMP, IMAGETYPE_ICO );


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


/**
* Filters whether the current image is displayable in the browser.
*
* @since 2.5.0
*
* @param bool $result Whether the image can be displayed. Default true.
* @param string $path Path to the image.
*/
return apply_filters( 'file_is_displayable_image', $result, $path );
}

The solution is to add the following code to the theme's functions.php:The article originates fromSinsTu NI-https://www.sinstu.com/archives/73.html

function webp_file_is_displayable_image($result, $path) {
$info = @getimagesize( $path );
if($info['mime'] == 'image/webp') {
$result = true;
}
return $result;
}
add_filter( 'file_is_displayable_image', 'webp_file_is_displayable_image', 10, 2 );
 
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);

Although Qiniu, Youpaiyun, Alibaba Cloud oss, Tencent Cloud cos, etc. all currently support WebP, we found that Apple devices do not support webp images, including the IOS version of WeChat. This may also be the reason why WordPress has not supported webp images. .The article originates fromSinsTu NI-https://www.sinstu.com/archives/73.html

If you find it troublesome to change the code, you can install a plug-in : Allow Webp imageThe article originates fromSinsTu NI-https://www.sinstu.com/archives/73.html The article originates fromSinsTu NI-https://www.sinstu.com/archives/73.html