Wordpress webp 图像预览 [英] Wordpress webp image previews

问题描述

我使用以下代码更新了 wordpress 以允许 webp 上传，

I have updated wordpress using the following code to allow for webp uploads,

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

效果很好，但 webp 图像不会在媒体选择器中显示预览，如图所示

Which works great, but the webp images do not show a preview in the media selector, as shown

无论如何我可以强制 wordpress 渲染 webp 预览吗?当我的网站完成时，它可能有数百个 webp 图片，在选择时无法看到它们可能是一个巨大的痛苦！

Is there anyway I can force wordpress to render webp previews? By the time my site is done, it could potentially have hundreds of webp images, not being able to see them when selecting could be a huge pain!

推荐答案

2021 年 7 月更新

从 WordPress 5.8 版开始，您可以像今天上传和使用 JPEG 或 PNG 图像一样在 WordPress 中上传和使用 WebP 图像(只要您的托管服务支持 WebP).将图像切换为 WebP 格式将提高您网站的性能和网站访问者的体验.
https://make.wordpress.org/core/2021/06/07/wordpress-5-8-adds-webp-support/

From WordPress version 5.8 forward, you can upload and use WebP images in WordPress like you would a JPEG or PNG image today (as long as your hosting service supports WebP). Switching to the WebP format for your images will improve your site’s performance and your site visitor’s experience.
https://make.wordpress.org/core/2021/06/07/wordpress-5-8-adds-webp-support/

---

我找到了在媒体管理器上显示缩略图的解决方案.您必须将以下代码添加到活动主题的 functions.php 中:

//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);

---

webp_is_displayable 函数正在使用 file_is_displayable_image 挂钩并检查文件(在 $path 上)是否是 webp 图像文件.要检查 webp 图像文件，该函数使用常量 IMAGETYPE_WEBP.

---

The webp_is_displayable function is using the file_is_displayable_image hook and checks if the file (on $path) is a webp image file. To check for the webp image file the function is using the constant IMAGETYPE_WEBP.

这篇关于Wordpress webp 图像预览的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！