Menu

Snippets

Yet another programmer blogging about code

Easy Digital Downloads and WebP images

Easy Digital Downloads is the ideal WordPress eCommerce plugin for sites that distribute non-physical products like software or ebooks. You can run into a problem if your site has WebP optimised versions of your images though. Easily fixed through a filter hook.

By default, EDD stores all files related to a product (which it calls a “download”) in a protected folder inside the standard WordPress uploads folder, in a subfolder called “edd”. If you add an extension, you can send product files to Amazon S3 instead, but it will still store any images you upload for your products in the protected “edd” subfolder.

EDD allows browsers to access the images in that folder by specifying a list of permitted extensions in its .htaccess file. That list includes files with extension ‘jpg’, ‘jpeg’, ‘png’, ‘gif’, ‘mp3’, ‘ogg’, but not ‘webp’.

All good, unless your website optimises images and saves a WebP copy, via a plugin like EWWW Image Optimizer. Those files can get blocked by the web server, returning 403 no permission error. On a website with some proactive anti-hacking tools like fail2ban, that can even lead to visitors getting blocked from accessing your website!

Luckily, there’s a filter hook that we can use to add the necessary extension. Add this code to a simple plugin, or include in your theme’s functions.php file.

/**
 * allow WebP images to be used for Easy Digital Downloads images
 * @param array $extensions
 * @return array
 */
add_filter('edd_protected_directory_allowed_filetypes', function($extensions) {
    if (!in_array('webp', $extensions)) {
        $extensions[] = 'webp';
    }
    return $extensions;
});

Now the .htaccess file needs to be updated. This can be done with the following steps:

  1. delete the old .htaccess file from the uploads/edd folder
  2. visit Downloads > Settings > Misc > File Downloads in the admin
  3. save the settings (no changes are necessary)

The .htaccess file will be regenerated, and will now include the webp extension.

NB: if your website uses nginx or anything other than Apache to serve image files, you might need to manually adjust your web server configuration rules to allow webp files. Otherwise, job is done.