Preview image on Panel

Kirby 4
, ,
1

Hello,

I’d like to preview my cover image as a thumbnail (like starterkit)

blueprints/pages/post.yml

[...]
  sidebar:
    width: 1/3
    sections:
      cover:
        type: files
        label: Cover
        layout: cards
        max: 1
        multiple: false
        query: page.previewCover
        required: true
        uploads: cover
[...]

Post model

final class PostPage extends Page
{
    public function previewCover()
    {
        return $this->image()?->thumb('cover') ?? false;
    }
}

I’ve uploaded an image but the field remains empty. I guess the issue is with the thumb() method but I don’t know what I need to add to make it work.

2

Your syntax is wrong, this query needs to go within the image property, see docs:

3

Thanks for the answer, but I don’t know what I should use instead

4 
image:
  query: page.previewCover

But somehow this doesn’t make sense in a files section, where the selected file should be previewed.

I’m not really sure what you want to achieve here. Could you please elaborate?

5

For each post, I add a cover image.
Usually this image is larger, and I use the thumb() method to crop it to the correct size.

I try, in the panel, to display this thumbnail

6

Right, but this is the blueprint for your posts. And it looks as if you want to select a cover image for your post. Therefore, you can either use a files section like you are currently doing, or maybe even better a files field. In any case, this section/field would then show the selected image.

Therefore, I do not understand the purpose of your query in this context. The query for a files section or field would have to return a files collection, i.e. multiple files, not a single file.

7

I think I got it all mixed up.

I’d rather find a way to overload the rendering!