Skip Navigation
BlurHash
Docs

Advanced

Get Started
Usage

Cropped images

Kirby doesn't support file methods on cropped images, so you'll have to use the original image, and pass the ratio as attribute to the element to get the correct BlurHash.

<?php $cropped = $original->crop(500, 400) ?>
<img
  src="<?= $original->blurhashUri(5/4) ?>"
  data-src="<?= $cropped->url() ?>"
  data-lazyload
  alt="<?= $original->alt() ?>"
/>

Working with static assets (using asset() helper)

All methods are available as asset methods since Kirby 3.9.2 and kirby-blurhash v1.2.0.

asset('assets/image.jpg')->blurhash();
asset('assets/image.jpg')->blurhashUri();
asset('assets/image.jpg')->blurhashColor();

Read more about the asset() helper here.

Aliases

$file->bh(); // blurhash()
$file->bhUri(); // blurhashUri()
$file->bhColor(); // blurhashColor()

Clear cache

The encoding cache is automatically cleared when an image gets replaced or updated, however you can also clear the cache manually with the clearCache static method:

<?php

use tobimori\BlurHash;

BlurHash::clearCache($file);

Options

tobimori.blurhash. Default Accepts Description
cache.decode true boolean Enable decoding cache
cache.encode true boolean Enable encoding cache
sampleMaxSize 100 number Max width or height for smaller image that gets encoded (watch out for memory)
componentsTarget 12 number Max number of components ("blur points") for encoding (x * y <= ~x)
decodeTarget 100 number Pixel Target (width * height = ~P) for decoding

Options allow you to fine tune the behaviour of the plugin. You can set them in your config.php file:

return [
    'tobimori.blurhash' => [
        'sampleMaxSize' => 200,
        'componentsTarget' => 12,
        'decodeTarget' => 100,
    ],
];