WP WebPNative

BUJ

Does it support non-WebP browser like Safari?

Yes, this is supported when using the html transformation function.

Does I need a PHP specific module?

No, you don’t.
The compression is done on several remote servers.

What is HTML modification?

This is the process of modifying the final HTML content of your page,
it will verify that the images are available in WebP format so that the client is WebP compatible.
If these last two cases are valid, the content will be update to present the image in WebP format.

How use Apache rule

Disable HTML transformation on module configuration page

add to .htaccess:

<IfModule mod_setenvif.c>
  SetEnvIf Request_URI "\.(jpe?g|png)$" REQUEST_image
</IfModule>

<IfModule mod_rewrite.c>
  RewriteEngine On
  RewriteCond %{HTTP_ACCEPT} image/webp
  RewriteCond %{DOCUMENT_ROOT}/$1.webp -f
  RewriteRule (.+)\.(jpe?g|png)$ $1.webp [T=image/webp]
</IfModule>

<IfModule mod_headers.c>
  Header append Vary Accept env=REQUEST_image
</IfModule>

<IfModule mod_mime.c>
  AddType image/webp .webp
</IfModule>

How use Nginx rule

Disable HTML transformation on module configuration page

Add to /etc/nginx/conf.d/webp.conf:

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

Add to your vhost file:

location ~ \.(png|jpe?g)$ {
  add_header Vary "Accept-Encoding";
  try_files $uri$webp_suffix $uri =404;
}