0

I am developing a WordPress plugin that optimizes the website. Currently, I am trying to convert all the images (PNG, JPG and JPEG) images to Webp using Rosell-dk's webp library https://github.com/rosell-dk/webp-on-demand which supports sending the image links via .htaccess as a GET request. But unfortunately it doesn't work, I am not sure if I am doing it wrong or if my approach is completely wrong.

I tried writing the rules that were stated by Rosell-dk on the GitHub page https://github.com/rosell-dk/webp-on-demand but unfortunately they doesn't work. The following is the rules that I have pasted on the .htaccess file which I created in my WordPress installation's 'wp-content' folder as all the images for a WordPress website resides there.

<IfModule mod_rewrite.c>
RewriteEngine On

# Redirect images to webp-on-demand.php (if browser supports webp)
RewriteCond %{HTTP_ACCEPT} image/webp
RewriteRule ^(.*)\.(jpe?g|png)$ /plugins/*my plugin name*/inc/webp-converter/webp-on-demand.php?source=%{SCRIPT_FILENAME} [NC,L]
</IfModule>

And in my 'webp-on-demand.php' I have the following

$imageSource  = $_GET['source'];

Unfortunately the file 'webp-on-demand.php' doesn't get called at all.

It would be great if y'all could help me figure out the correct rules or where I am wrong.

Minhaz Mohamed
  • 11
  • 5
  • add `AddType image/webp .webp` at end of `.htaccess` and also check `rewrite mode` is enabled in Apache – Jimish Gamit May 17 '19 at 19:41
  • also path should be `/wp-content/plugins/*your plugin name*/inc/webp-converter/webp-on-demand.php?source=%{SCRIPT_FILENAME}` – Jimish Gamit May 17 '19 at 19:42
  • @JimishGamit I tried what you suggested and unfortunately it didn't work. The folder in which the webp images are suppose to be stored are empty. I did manually test the file which converts and it works, manually meaning by sending a source in the URL while accessing `webp-on-demand.php` on my WordPress installation. – Minhaz Mohamed May 17 '19 at 20:56
  • I also added the rules to the root `htaccess` thinking I was wrong to have the rules in the `wp-content` folder. But that didn't also work... – Minhaz Mohamed May 17 '19 at 20:58
  • Also, I tried my solution on another hosting which is hosted via GoDaddy and it worked. Turns out the GoDaddy is `apache` and the one I was trying all this time is `nginx`. I'm a noob when it comes to nginx, so how do I implement the `htaccess` for the `nginx` server? – Minhaz Mohamed May 17 '19 at 22:29
  • `.htaccess` won't work for nginx – Jimish Gamit May 18 '19 at 06:15

1 Answers1

0

As you mentioned you are using nginx below steps should help you.

First, check whether mime type has webp

cat /etc/nginx/mime.types | grep webp

it should show you

image/webp  webp;

now 

server{
  location ~* ^(/wp-content/.+)\.(png|jpe?g)$ {
    set $base $1;
    set $webp_uri $base$webp_suffix;
    set $webp_old_uri $base.$2$webp_suffix;
    set $root "<<FULL PATH OF wp-content PARENT>>";
    root $root;
    add_header Vary Accept;
    if ( !-f $root$webp_uri ) {
        rewrite ^(.*)\.(jpe?g|png)$ /wp-content/plugins/*your plugin name*/inc/webp-converter/webp-on-demand.php?source=$webp_uri break;
    }
    try_files $webp_uri $webp_old_uri $uri =404;
  }
}

make sure you replace <<FULL PATH OF wp-content PARENT>> with the actual disk path

Jimish Gamit
  • 1,014
  • 5
  • 15