Detailed Kirby documentation for thumbs?

Hi there. I’ve built a few text-driven Kirby sites (on 1.x and 2.0), and I’m looking into how Kirby can work with images, especially generating a few images from a source.

I knew there was a built-in tool in K2 for that, but the only doc I could find was this page from the cheatsheet (and I first I had only found a one-liner from the toolkit doc):

So I wanted to know, are there more docs around for this feature? Broad information on how it works, how it can be configured (if at all)?

It might also be a good idea to mention this feature (and link to the cheatsheet entry or a more elaborate doc) in this page:
Right now you basically have to know already that Kirby can do this, and fish for the right cheatsheet entry. I wouldn’t be surprised if, as a result, many developers end up just using big JPEG images for thumbnails. So ideally (ping @bastianallgeier) this information would be easier to find and a bit more user-friendly. :slight_smile:


Hello – indeed infos on the whole thumbs() handling are a bit sparse; a good starting point is the actual source which lists all available parameters. When the function was available as a plugin in Kirby 1, there was a more thorough doc which I can’t find for the moment.

Some notes from the top of my head:

  • if you pass a boolean at the end of the function, it outputs the URL only, like
    thumb($image, array('width' => 960, 'crop' => true, 'quality' => 50), false);
    which is great for generating sources for multiple resolutions (don’t forget to note those in the filename var, or they are only separated via different hashes)
  • There are two replacement plugins (ImageConverter, KirbyText Extension - Image) which offer more elaborate options, like converting sRGB profiles.
  • Then there’s the option of switching from GD to Imagick lib, which some people prefer performace-wise.
  • You can force file formats by setting the extension in
    'filename' => '{safeName}-{hash}.{extension}'
  • Thumb toolkit uses a fork the Simpleimage lib, but doesn’t make use of all of it’s options – with a bit of fiddling, you have access to more filters this way.

Excellent! Thanks for all this information. :smile:

Bastian added a detailed doc for thumbnails:

1 Like