PHP WebP Thumbnailer

aradpardaz

Hossein Sadeghi

Posted on March 11, 2023

PHP WebP Thumbnailer

PHP thumbnailer with WebP support

WebpThumbnailer is a thumbnail helper which allows you to generate and cache image thumbnails in your PHP application on the fly.

Installation

php composer.phar require "maximal/php-webp-thumbnailer" "*"
Enter fullscreen mode Exit fullscreen mode

Checking the environment

You will need WebP coder (cwebp command) installed in your system.

For instance in Ubuntu/Debian it is included in webp package:

sudo apt install webp

Check the command:
cwebp -version

You should get an output with version number (like 0.6.1).

If you have installed cwebp to a different command or path, configure the static property

WebpThumbnailer::$cwebpCommand 
Enter fullscreen mode Exit fullscreen mode

before using the helper (see the example below).

More info about WebP: https://developers.google.com/speed/webp/

Generating thumbnails

Use this thumbnailer in your PHP application:

`use maximal\thumbnail\WebpThumbnailer;

echo WebpThumbnailer::picture('/path/to/img/image.png', $width, $height);`

More options (outbound instead of default inset; alt and class attribute added):

use maximal\thumbnail\WebpThumbnailer;

echo WebpThumbnailer::picture(
    '/path/to/img/image.png',
    $width,
    $height,
    false,
    ['alt' => 'Alt attribute', 'class' => 'img-responsive']
);
Enter fullscreen mode Exit fullscreen mode

Custom cwebp command:

use maximal\thumbnail\WebpThumbnailer;

WebpThumbnailer::$cwebpCommand = '/usr/local/bin/cwebp';
echo WebpThumbnailer::picture('/path/to/img/image.jpg', $width, $height);
Enter fullscreen mode Exit fullscreen mode

The helper’s picture() method uses modern HTML tag as follows:

<picture data-cache="hit|new">
<source srcset="/assets/thumbnails/...image.png.webp" type="image/webp" />
<img src="/assets/thumbnails/...image.png" other-attributes="" />
</picture>

Here you have image/webp source for browsers which support WebP images and traditional (PNG, JPEG, TIFF, GIF) image fallback.

Useful for photo articles: https://www.delgarm.com/

Author

Websites: https://maximals.ru and https://sijeko.ru
github: https://github.com/hsa599

💖 💪 🙅 🚩
aradpardaz
Hossein Sadeghi

Posted on March 11, 2023

Join Our Newsletter. No Spam, Only the good stuff.

Sign up to receive the latest update from our blog.

Related

PHP WebP Thumbnailer
webdev PHP WebP Thumbnailer

March 11, 2023