Kirby's built-in thumbs creator lets you resize and crop any image on the fly in your templates. You can not only resize and crop images from the content folder, but also from the assets folder directly.
With Kirby's new Thumbnail API, thumbs are generated asynchronously. This makes thumb creation feel at lot faster and creates less memory issues, which could easily become an issue with many images or when creating many different images sizes to serve responsive images.
A new set of plugin points can be used to hook into the thumbnail API or the thumbnail URLs, see core components.
In a default setup, thumbnails are stored in the
$image->resize(300); $image->resize(300, 200);
You can set from which position a file should be cropped. The following crop options are available:
This is how to use the crop positions in your code:
// quick and simple $image->crop(100, 200, 'top right'); // more fine grained control $image->crop(100, 200, [ 'quality' => 70, 'crop' => 'left' ]);
blur method applies a blur filter to an image. You can modify the intensity of the blur effect by passing an integer. The default value is 10.
The grayscale method converts an image to grayscale.
Options for thumbnails are set with the
thumbs key in Kirby's configuration:
You can define option presets for thumbs in your
Then you can use them e.g. in your templates:
$file->thumb(); // for default preset $file->thumb('blurred');