无法在这个位置找到: head2.htm
当前位置: 建站首页 > 新闻 > 公司新闻 >

Nginx Wordpress给照片打开Webp全自动变换适配计划方案

时间:2021-04-11 14:34来源:未知 作者:jianzhan 点击:
温暖提醒小小助手:1. 最先实际操作大的变更前的良好的习惯,备份数据网站文档和数据信息库,假如有应用快照更新作用,提议一并建立一份当今快照更新做为备份数据,备份数据是

温暖提醒小小助手:

1. 最先实际操作大的变更前的良好的习惯,备份数据网站文档和数据信息库,假如有应用快照更新作用,提议一并建立一份当今快照更新做为备份数据,备份数据是良好的习惯。

2.虚似服务器能没法开展配备,本实例教程合适应用单独服务器如阿里巴巴云ECS等用以单独管理权限的网站站长实际操作。

什么叫webp文件格式

   WebP是由Google开发设计的新图象文件格式,适用Chrome,Opera和Android等全世界73.13%的访问器(数据信息统计分析来源于海外社区论坛),历经缩小优化算法提升后可在Web上完成迅速,更小的图象。webp与同样视觉效果品质的PNG和JPEG图象对比,其规格变小了约30%。此外,WebP文件格式还具备两者之间他照片文件格式同样的作用

不利于缩小:webp不利于缩小根据VP8重要帧编号,VP8是On2Technologies建立的视頻缩小文件格式,是VP6和VP7文件格式的事后版本号。 高质量缩小:webp高质量缩小文件格式由WebP精英团队开发设计。 全透明度:八位Alpha安全通道对图型图象很有效。Alpha安全通道能够与不利于RGB一起应用,它是现阶段一切别的文件格式都没法应用的作用。 动漫:webp适用真五颜六色动漫图象。 数据库:webp将会具备EXIF和XMP数据库(比如,由照相机应用)色调配备文档:webp将会具备置入式ICC配备文档。 Webp软件安裝

  WordPress dashboard后台管理面,点一下软件plugins栏,挑选add new增加,检索EWWW Image Optimizer后点一下安裝并开启

软件plugins-installed已安裝,寻找EWWW Image Optimizer-settings,最先留意看Optimization API Key栏,可去其官方网申请办理key,激话后提升选择项可打开高級提升,大家还可以忽视这方面,由于传统式的jpeg,png等照片有许多完全免费的线上提升专用工具,能够提升好后再提交。点一下wepb-JPG/PNG to WebP,启用该项。这一作用是webp全自动变换。 最先JPG到WebP的变换是不利于的,但品质损害不大。PNG到WebP的变换是高质量的。次之jpg等原照不容易删掉除,webp文档仅检验到适用webp文件格式的访问器时启用 打开软件后将会会提醒EWWW Image Optimizer requires exec() or an API key. Your system administrator has disabled the exec() function, ask them to enable it. 大家必须编写php.ini文档,检索 exec,精准定位到下边这一行,删掉在其中的exec后储存改动,以后重新启动php服务再进到软件设定也不会报这一不正确了
disable_functions = passthru,exec,system,chroot,chgrp,chown,shell_exec
Nginx网络服务器配备

    编写Nginx配备文档:一般相对路径为/etc/nginx/nginx.conf,假如是宝塔面板控制面板配备的网络服务器,则立即点一下Nginx控制模块-配备,加上以下编码到http块里的结尾:

map $ept $webp_suffix {
 default "";
 "~*webp" ".webp";
}

&ept标头包括“webp”,则将$ webp_suffix设定为“.webp”。

   第二个作用是保证Nginx了解.webp文档是啥,鉴别webp文件格式;尽管较新版本本的Nginx应当早已鉴别出WebP文件格式,但主导的祥助還是提议开启mime.types文档去看看看是不是带有该编码(相对路径/ etc / nginx /中)为此告知Nginx这一新文档种类。搜索以下这方面此番,假如精准定位找不着,则必须手动式加上它:

image/webp webp;

留意啦:宝塔面板控制面板建网站下Nginx的mime.type文档坐落于

/www/server/nginx/conf/mime.types

  最终大家必须在在站点配备文档的server块中设定编码,以解决将会具备WebP文件格式的变换。一般坐落于/ etc / nginx / sites-enabled / default中。老国际惯例,宝塔面板控制面板建网站得话立即点一下站点-设定-配备,从这儿加上编码块到Server的}完毕闭合标识以前:

location ~* ^.+\.(png|jpe?g)$ {
 add_header Vary Accept;
 try_files $uri$webp_suffix $uri =404;
}

之上三个流程都实际操作结束后,提议重新启动一次Nginx服务


    这时候候大家再回到EWWW Image Optimizer-settings-wepb-JPG/PNG to WebP,看一下右下方webp检测照片是不是变绿,假如還是鲜红色,那麼大家则必须开启js重新写过的輔助作用(依照资询软件官方网的回应,提议是先依照Nginx网络服务器端实际操作,假如沒有变绿再去开启JS重新写过),同时假如设定了 server-level caching solution,及其应用了cloudfare等CND缓存作用,那网络服务器端设定的重新写过标准不是会起效的,因此打开JS重新写过是务必实际操作的。

JS重新写过作用

      进到软件的设定EWWW Image Optimizer-settings-webp-JS WebP Rewriting,启用该项后更新网页页面,右下方的webp检测照片就变为翠绿色了,大获全胜! webp-js重写功能webp-js重写功能启用js webp rewriting重新写过作用 检测比照


最先说一下wordpress下輸出webp照片文件格式的逻辑性,那时候大家给站点配备了所述webp的作用后,最先网络服务器和软件会检验,假如jpeg等照片变换为webp文件格式后,其文档容积尺寸是不是会比原照更小;假如更小,则转化成webp并开展智能化輸出启用;假如不容易更小,则不做webp变换和启用。这一软件的优势就取决于这儿,十分智能化化的輸出逻辑性。

次之对适用webp照片文件格式的访问器,全自动启用和輸出该照片相匹配的webp文件格式,如  

由于会保存所有的原照,那麼对不兼容webp文件格式的访问器,輸出和启用其jpeg等原照

这一逻辑性便是较为好的webp輸出方法,无需怕顾客应用的访问器不兼容webp而造成网站无法显示照片,十分智能化化。下列是本人检测的比照結果:

IE和Chrome浏览器自动识别webpIE和Chrome浏览器自动识别webpIE访问器下輸出jpeg,chrome访问器下輸出webp文件格式

最终填补一个小点:

    软件默认设置对jpeg,png,jpg照片文件格式的缩小级別是basic,主导的祥助检测了和tinypng比照,其缩小率要低一点。因而沒有申请办理到完全免费API的状况下,祥助提议全部的照片先根据tinypng开展一次提升,再提交到wordpress新闻媒体库,同时软件会全自动分辨缩小后与原照的容积差别决策是不是要转webp

大量经营干货知识,扫二维码添加跨境E站知识星球为主的祥助的知识星球为主的祥助的知识星球 著作权声明:跨境电商E站,著作权全部丨如未标明,均为原創丨本站选用BY-NC-SA协议书开展受权 <

转截请标明:跨境电商E站 Nginx WordPress给照片打开Webp全自动变换适配计划方案

Some kind of troubleSome kind of trouble主导的祥助

全栈经营师 | 阿里巴巴巴巴国际性站经营 | WordPress建网站喜好者

经营武器-阿里巴巴出口外贸设备人小助手 | 数据信息提高-阿里巴巴国际性站代运营公司服务

/author/1 用手机微信 OR 付款宝 扫描仪二维码 请网站站长 喝一杯星帕洛 pay_weixinpay_weixinpay_weixinpay_weixin微信公众号微信公众号 专业知识付钱,额度随便 小主的适用是本网站经营的驱动力!~ 喜爱 (19)or共享 (0) (责任编辑:admin)
织梦二维码生成器
顶一下
(0)
0%
踩一下
(0)
0%
------分隔线----------------------------
无法在这个位置找到: ajaxfeedback.htm
栏目列表
推荐内容


扫描二维码分享到微信

在线咨询
联系电话

400-888-8866