Show thumbnails instead of original images

Kirby 3 Questions 🤔
1

Hey all! I’m using Kirby to build a site that displays a lot of images. This is why I’d like to use thumbnails (generated by Kirby) instead of the original image files which can take quite some time to load.

This is what I added to my config.php:

return [
  'thumbs' => [
    'driver'    => 'im',
    'quality'   => 80,
    'width'     => 1000,
    'bin'       => '/usr/local/bin/convert',
    'interlace' => true
  ]
];

This is the code I use in my template:

<img src="<?= $item->key()->toFile()->url() ?>">

I can’t figure out which code to add in order to load the thumbnails. Neither <img src="<?= $item->key()->thumb()->url() ?>"> (no images at all) nor <img src="<?= $item->key()->thumb()->url() ?>"> (original files rather than thumbnails) seem to work.

Can someone enlighten me? Thanks!

2

Looks like you are trying to fetch an image from a field called key? But that information is missing in your description of the problem. And what is $item? Assuming that is a page in a loop:

<?php if ( $image = $item->key()->toFile() ) : ?>
  <img src="<?= $image->resize(200)->url() ?>">
<?php endif ?>

Or $image->thumb(['width' => 200]) or whatever parameters you need here.

If you want to use presets, check out the docs how to define them: https://getkirby.com/docs/reference/system/options/thumbs