Altering image server-sided

1

Hello,

I am currently looking for ways to change the contrast of images server-sided. I would like to use certain images as a mask. For cross-broswer-compatibility, I would like to use the images as css mask instead of svg filters and svg masks. This requires the images to already be b/w and high contrast. Is there a way to use e.g. ImageMagick or some other php library or kirby plugin within kirby to do so? I am thinking about something like $image->brightnessContrastImage($brightness, $contrast, $channel)->url()

Thank you for any hint!

2

You could create a custom thumb driver for ImageMagick with support for such image manipulations.

3

kirby uses simpleimage under the hood which has methods to darken or change contrast. but like said kirby does not expose all of the available methods (which i dont know why to be honest) so you need to create a custom wrapper (the darkroom) to call them there.

4

Thank you for the replies! I am quite new to this level of working with php so please exuse my possibily naive question.

I thought about altering the grayscale method to also increase the contrast of my image. I created a file plugins/customGrayscale/index.php with the following code:

<?php

class CustomImageMagick extends Kirby\Image\Darkroom\ImageMagick
{
	protected function grayscale(string $file, array $options): ?string
	{
		if ($options['grayscale'] === false) {
			return $image;
		}

		return $image->desaturate()->contrast(80);
	}

}

Kirby\Image\Darkroom::$types['custom-im'] = CustomImageMagick::class;

However, this does not change anything. It probably is not as easy, right? Do I have to register the plugin elsewhere? Do you maybe have a code example of a simple custom thumb driver, where I could see how it is done and how it is registered?

Thank you!

5

Or could you maybe just point me to an example of a custom thumb driver? That would be of great help!

6

The focus plugin has a custom thumb driver: Focus | Kirby CMS

7

Also remember to delete eventual thumbnails generated in the /media folder between tests, otherwise it won’t generate new images with the same filename.
Also remember to actually set your driver in the config.php:

return [
    'thumbs' => [
        'driver' => 'custom-im'
    ]
];
1 Like