Main page with cover images linked to subpages

Kirby 3
,
1

Dear community,

I’m working on my first project with Kirby and from what I’ve seen and done so far, it’s a real joy to work with. I learned already a lot but i’m still at the beginning to understand.
I am in the process of creating a gallery. A main page with links to a couple of subpages (different galleries). I want to show one image per gallery on the main page. This images are located in the main folder. Clicking on this image, shows the respective gallery. The images on the main page are not part of the subpages.

I tried to create the main page with “Layouts”. This works quite well. However, I want to create a blueprint in the panel, which maps the frontend structure the same way. When I do that with layouts, I can’t get to the subpages in the panel via link. If I create the Blueprint with Pages (Cards), I get the first image of the subpage, which I don’t want.

II searched in the forum, but could not really find something similar. Maybe there is anyone here who has already implemented something like this, or points me to the right place (where it has been written yet)? Would be glad about an answer. Thanks a lot!
Rene

2

You can set which image you want to show via the image property. This can be set for the section/field individually, or in the subpages blueprint:

3

Hi Sonja,

Thank you for your help. But somehow I don’t get it. My blueprint looks like:

title:
    de: Galerie
    en: Gallery
sections:
  galerien:
    type: pages
    layout: cards
    image: page.images.findBy("name", "cover")
    template: bilder
    image:
      ratio: 3/2
      cover: true

Obviously wrong. I had almost once but i messed it up. With this, the images of the subfolders are shown. An other problem is the template, but I think this I can wangle at a later stage.

For sure there is an easy way to do that blueprint.

Maybe do you have the nerve to explain this to me with an example (possibly incl. a template snipped).

As I said I am still very much at the beginning with Kirby.

Thank you so much!
Rene

4

Ok, you want to show an image for the subpage, but this image is located in the parent. For this to work, you would have to select the image that should be assigned to each subpage somewhere, ideally via an image field in the subpage, e.g. a field called cover.

Then you can query this cover image in the section, e.g.

sections:
  galerien:
    type: pages
    layout: cards
    image: page.cover.toFile() # assuming you have a field called cover in the subpages
    template: bilder
    image:
      ratio: 3/2
      cover: true

Or there would have to be some other relation between the images in the parent page and the subpages, e.g. via filenames.

With your current query you would only get a result if each of the subpages in that section had an image called cover.

5

That helped me a lot!

My blueprint looks like this now, and it works as expected. The corresponding cover images are located in the respective subfolder.

title:
    de: Galerie
    en: Gallery
sections:
  galerien:
    type: pages
    layout: cards
    image: page.cover.toFile()
    info: Bilder-Galerie
    template: bilder
    image:
      ratio: 3/2
      cover: false

Thanks a lot Sonja!