webp not generating for all image sizes

Hey Chuck,

Can you provide your website URL as well as a page where not all webp images are being sent to Chrome?

Ok the list of image files in the previous message are fed to this page:

https://opexsociety.org/featured-articles/operational-excellence-manifesto/

Now the issue was that the OpEx-Manifesto-Alfa-Slab-Noise-720×482.png was the file that was getting fed to the browser mainly because the bulk optimizer didn’t create a webp version of the file. I’ve subsequently used the script below to generate the missing files in some of the directories.

As I looked further into this I noticed there were many png or jpg files that didn’t have an associated webp file so I figured I’d do a crash course in bash scripting and try to come up with something that would bulk convert jpg or png files using the API. What I came up with is the following

#!/bin/bash

# Optimus.io API image converter
# Convert image (jpg, png) to webp

# Usage: makewebp.sh image.png .png
# Usage: makewebp.sh image.jpg .jpg
# Usage: find  -type f  -name "*.png" -exec ./mkwebp.sh {} .png \;

name=$1
ext=$2
dir=<code>dirname $1</code>
cvt_name=$dir/<code>basename $1 $2</code>.webp
key=<insert API key here>

if [ ! -e "${name%.*}".webp ]; then
        if ((<code>stat -c%s $1</code> >= 5242880)); then
                echo "***Error $1 exceeds 5MB filesize limit ***"
                echo ""
        else
                echo "Converting $1"
                curl --data-binary @"$name" -o "$cvt_name" -H 'user-agent: Optimus-API' -H 'accept: image/*' https://api.optimus.io/"$key"?webp
                echo ""
        fi
fi

It’s not pretty but it works. I’m not a bash scripting genius by any means but I think I did pretty well on my first go. Sure it could be better and maybe it will at some point.

Also of note I’ve added this to my .htaccess file

<IfModule mod_rewrite.c>
  RewriteEngine On
  # check if browser accepts webp
  RewriteCond %{HTTP_ACCEPT} image/webp 

  # check if file is jpg or png
  RewriteCond %{REQUEST_FILENAME} (.*)\.(jpe?g|png)$

  # check if corresponding webp file exists image.png -> image.webp
  RewriteCond %1\.webp -f

  # serve up webp instead
  RewriteRule (.+)\.(jpe?g|png)$ $1.webp [T=image/webp,E=accept:1]

</IfModule>

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

</IfModule>

AddType image/webp .webp

Not 100% sure if that’s correct but it doesn’t seem to break things all over the place if it isn’t. If I use the developer tools in Chrome to look at the content I’m getting I notice the bulk of the images are showing the webp image format in the type column so that’s a good thing.

Is this the “proper” way to go about this? Is there a better way?

Thanks
Chuck

Damn, well the backticks got all messed up in that shell script.

Optimus only consider images found in the xx_postmeta table in the records with the meta_key _wp_attachment_metadata. Just verify if the thumbnails are there that have been skipped before.