Webp not working

Kirby 3 Questions 🤔
1

Hi, I’m trying to get the webp plugin from hash and salt by @jimbobrjames to work on my website

I’ve downloaded the latest version of the plugin and put it in the plugins folder.

In my template I use the following snippet:

<?php snippet('webp', ['sizes' => [1920, 1140, 640, 320], 'src' => 'this-is-an-image.png', 'type' => 'png', 'class' => 'picturetagclass', 'width' => 800, 'height' => 600]) ?>

But I get the following error: Call to a member function toWebp() on string

Can’t seem to figure out how to get it up and running. Any advice?

2

I guess, src needs to be File object, not string. Something like that:

'src' => $page->cover()->toFile()
3

This plugin was made for Kirby versions prior to 3.6. That version supports Webp out the box, and you no longer need my plugin. I would suggest swapping to that if you can.

4

Thanks! Is there a more elaborate documentation on how to implement webp images in kirby than this?

I’ve added this to my config file

    'thumbs' => [
        'driver'    => 'im',
        'format' => 'webp',
        'bin'       => '/usr/local/bin/convert',
        'interlace' => true,
    ]

And using this in my template:

<?= $img->toFile()->thumb(['width' => 400, 'format' => 'webp', 'quality' => 10]) ?>

which does serve me this file on my website:

/image-400x-q10.webp

It does seem to work according to the file name but the image is shown in high quality (over 1mb) and the cropping I used before isn’t working as either one of these:

$image->toFile()->crop(1080, 1420, 'center right')->thumb();
$image->toFile()->thumb(['crop' => 1080, 1420, 'format' => 'webp', 'quality' => 10])
5

Update: Switching to the gd driver helped me out (although imagick is also turned on). However I still don’t know how to properly crop the image to different aspect ratio like

->crop(1080, 1420, 'center right')

would do.

6

is '/usr/local/bin/convert' correct?
in a shell, try typing which convert and see what it gives you.

$image->toFile()->thumb([
  'crop' => true,
  'width' => 1080,
  'height' => 1420,
  'format' => 'webp',
  'quality' => 10
])
7

I don’t really know what ‘bin’ does. Just copied this from this section in order to get it working :grimacing:

Thanks for showing me to right way to crop. Is there also a way to use ‘center right’ as cropping reference?

8

Hi, the im driver relies on a command line program to be available. That is convert. This program could however be either not installed at all, or be installed in different locations (on my local machine, for example it is in /usr/bin/convert, but it literally could be anything).
If you have imagemagick installed (of which convert is a part), you can write the command which convert in a shell and it will normally give you the correct path to where it can be found; or tell you if it isn’t.

I think

$image->toFile()->thumb([
  'crop' => 'center right',
  'width' => 1080,
  'height' => 1420,
  'format' => 'webp',
  'quality' => 10
])

should do :slight_smile: