8ec9f9a38d874ab

 

Converter for Media 是 WordPress 上一款非常热门的图片格式转换插件,可以免费将站内图片转换为 WebP 格式,有效提升网站加载速度。不过,当服务器环境使用 Nginx(宝塔面板默认)时,需要手动修改站点配置文件才能让插件正常工作。官方的文档对新手可能不太友好,所以奶爸今天用图文结合的方式,一步步教你如何在宝塔面板中正确配置,确保 Converter for Media 顺利运行。


第一步:打开网站设置界面

  1. 登录宝塔面板,在左侧点击 网站,进入网站列表。

  2. 找到你需要配置的目标网站,点击右侧的 设置

  3. 在弹出的窗口中,切换到 配置文件 选项卡。

  4. (重要) 先将当前配置文件的所有内容复制一份到本地文本文件中保存,以便出错时恢复。

![网站设置界面](Wp blog 325)


第二步:修改 Nginx 配置文件

1. 添加插件所需代码

将以下代码块完整复制:

# BEGIN Converter for Media
    set $ext_avif ".avif";
    if ($http_accept !~* "image/avif") {
        set $ext_avif "";
    }
    
    set $ext_webp ".webp";
    if ($http_accept !~* "image/webp") {
        set $ext_webp "";
    }
    
    location ~* ^/wp-content/(?<path>.+)\.(?<ext>jpe?g|png|gif|webp)$ {
        add_header Vary Accept;
        add_header Cache-Control "private";
        expires 365d;
        try_files
            /wp-content/uploads-webpc/$path.$ext$ext_avif
            /wp-content/uploads-webpc/$path.$ext$ext_webp
            $uri =404;
    }
    # END Converter for Media

2. 找到准确的插入位置

这段代码必须放置在 server { … } 块内部,并且要放在 其他所有 location 指令之前,以及 所有 include 指令之前

简单来说,打开配置文件后,往下滚动找到 server { 这一行,紧跟着它的后面(通常在十几行左右)就是最佳插入点。你可以参考截图中的位置。

3. 修改现有图片处理规则

在配置文件中找到下面这段原有代码(通常用于处理图片缓存):

location ~ .*\.(gif|jpg|jpeg|png|bmp|swf)$
{
    expires      30d;
    error_log /dev/null;
    access_log /dev/null;
}

将其修改为:

location ~ .*\.(bmp|swf)$
{
    expires      30d;
    error_log /dev/null;
    access_log /dev/null;
}

修改目的:将 gif|jpg|jpeg|png 从这条规则中移除,因为图片格式转换的逻辑已经由刚才添加的 Converter for Media 规则接管,两者不能重叠冲突。

4. 保存配置文件

完成以上添加和修改后,点击 保存 按钮。如果配置语法正确,宝塔面板会提示保存成功,不会报错。


第三步:测试插件是否正常工作

返回 WordPress 后台,进入 Converter for Media 插件设置页面。如果之前的配置正确,原本的红色错误提示应该会消失,你可以正常进行插件设置或批量转换图片。这就说明插件已经可以与你的服务器正常通信了。


第四步:如何验证图片是否已转换为 WebP?

很多用户配置完成后,在前台查看图片地址或右键保存图片时,发现图片后缀依然是 .jpg 或 .png,误以为插件没生效。其实这是正常现象,也是插件特意设计的。

插件的工作原理(重要):

  1. 浏览器请求图片:/wp-content/uploads/photo.jpg

  2. 插件检测到浏览器支持 WebP 格式。

  3. 服务器内部进行重定向,实际返回给浏览器的是:/wp-content/uploads-webpc/photo.jpg.webp

  4. 浏览器收到了 WebP 格式的图片,但地址栏显示的 URL 仍然是 photo.jpg

这种设计的优势:

  • SEO 友好:URL 不变,对搜索引擎优化没有影响。

  • 兼容性好:不支持 WebP 的老旧浏览器,仍会收到原始格式图片。

  • 无侵入性:不需要修改主题模板或页面源码。

正确的验证方法:

不要查看网页源代码,请使用浏览器开发者工具

  1. 在网站前台页面,按键盘 F12 键(或右键 -> 检查)打开开发者工具。

  2. 切换到 Network(网络) 标签页。

  3. 刷新页面,筛选过滤出 Img 或图片类型的请求。

  4. 点击任意一张图片,查看 Response Headers(响应头) 中的 Content-Type 字段。

  5. 如果显示为 image/webp 或 image/avif,就证明插件配置成功,图片已经被成功转换和分发。

![浏览器开发者工具验证](Wp blog 326)

小提示:如果你在 Network 中看到某些图片依然返回 image/jpeg,通常是因为插件内部机制判定转换后的 WebP 图片体积比原图还大,为了性能考虑,自动跳过了这张图片的处理。

声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。