With a new install of Kirby 4, I’ve set a focal point and then set an image to crop (in an image block) but Kirby seems to ignore the focal point and simply crops to center. What am I doing wrong? Thanks in advance!
I don’t know, have you set any crop options in your config to center? The focal point should usually be applied automatically.
I have the same problem. The focus point is ignored in the crop in the image preview. It is always only cropped centred
I have no settings for images in the config. What could be the problem?
The focus point is at the top of his head, but the centre of the crop is in the middle
Are you talking about the display in the panel or the rendered image in the frontend?
Without knowing the code from your template, debugging is of course a bit difficult. So first try the easy way and look at the image name in the source code or in the console. Is it structured like this?
laughing-guy-1800x1800-crop-50-9-39-1-sharpen50.jpg
The important part is the section crop-50-9-39-1 which indicates that the image has been cropped. And the numbers tell you that the focus point has been detected.
I am talking about the display in the panel.
The image name does not contain any of the Crop information. It only contains the size of the image 2048x2030.
To do this, look at the ‘ratio:’ and ‘crop:’ areas in the blueprint:
You can see how this works in practice in the Kirby Starterkit. But remember that this setting does not process the images on the frontend. You do that in the template, preferably in a custom snippet, as explained in the link.
That’s exactly what my blueprint looks like. I have the default blueprint for block images.
I understand that has to be done in the frontend itself, but unfortunately it doesn’t work in the backend either.
Ah, good to know that the aspect ratio display is already working. You now also want to apply the focus point, right? The panel only uses CSS to display the aspect ratio and the image is not yet cropped here. I am not aware of a standard setting for displaying the focus point in the panel. I tested it in my project, and here the image is also centred, even though the focus point is at the bottom.
I see, in this case it probably doesn’t work.
Is there an alternative? The client would like to be able to select the crop in the panel. The plugins that are available are obviously outdated.
That’s right, the plug-in only works with Kirby 3. I’ll have to ask @distantnative @ahmetbora whether the focus point in the panel can be adopted.
I’m not sure if these suggestions will help but worth a try
Have you tried the IM driver?
What is the source image file type? I’ve had issues trying to crop AVIF files for example.
How large is the file? If you’re uploading a massive 20 MB image file, Kirby could struggle.
I’m not sure how the IM driver relates to custom cropping of images?
Maybe you can explain that a bit?
Imagick (IM) and GD are the underlying image optimization libraries that Kirby is using. They do the actual cropping. I’m suggesting that changing from the default (gd) to im, may fix the issue you’re facing. It might not either. I’m using Kirby 4 and my cropping works but I am using the im driver hence why I suggested it.
I hope this clarifies
@neville breaddes question is, however, refers to the display in the panel. Here, no image is cropped, but modified using CSS.
@GB_DESIGN Ah, so the Kirby panel isn’t loading a new thumb, it’s just cropping with CSS? I thought the panel did create it’s own thumbs for panel previews
@neville You can check this in the Starterkit by changing the aspect ratio of an image and then right-clicking to open it in a new window.
<figure
class="k-frame k-image-frame k-image"
style="--fit: cover;--ratio: 21/9;">
<img alt="" src="https://startetkit.com/media/pages/about/fc31832350-1718273580/team.jpg">
</figure>