Panel - two "file upload" mixed together

Kirby 3 Solved ✅
1

Hello!
I have a “publication page” which in it the client needs to upload a cover image and also a PDF of the publication. The cover image and the PDF are both “type: files”. The .yml file goes like this:

columns:
  - width: 1/3
      sections:
        image:
          type: files
          max: 2
          layout: cards
          image:
            ratio: 4/5
            cover: true

  - width: 2/3
      sections:
        information: 
          type: fields
          fields:
            title:
              label: Title of book
              type: text
            publisher:
              label: Publish by 
              type: text
            medium:
              label: Langauge, number of pages and size
              type: text
            ISBN:
              label: ISBN 
              type: text
            pdf:
              label: upload PDF
              type: files
              max: 2

For some reason, when the client upload a PDF file it is previewed in the place where the cover image is previewed. if the cover image is uploaded too so it is placed beneath it.
It doesn’t really make a difference but it does make a confusion - because if the client uploads a PDF it seems like he uploaded a cover image. Here is a screenshot of the panel:

Screen Shot 2022-05-03 at 7.08.38 AM
Screen Shot 2022-05-03 at 7.08.38 AM1920×957 68.7 KB

Would appreciate any help. thanks a lot! :slight_smile:

2

If you use a section for the cover image rather than a files field, you have to assign a template to the section.

3

Thanks for the reply
I just cancelled the sections and it works. but I would like to understand what does it mean to assign a template to the section. or if there’s a different way to create a 2 column grid when the left side is a big image (cover image) and the right side is for the other details

Thanks

4

You can continue to use a section, but use template:

columns:
  - width: 1/3
      sections:
        image:
          type: files
          template: cover
          max: 2
          layout: cards
          image:
            ratio: 4/5
            cover: true
# rest of blueprint

Then you can get the file in your template with:

<?php foreach ($page->images()->filterBy('template', 'cover')): ?>
  <?php // do stuff ?>
<?php endforeach ?>

Or you make it a field:

columns:
  - width: 1/3
      sections:
        imagesection:
          type: fields
          fields:
            cover:
              type: files
              max: 2
              layout: cards
              uploads: cover
              image:
                ratio: 4/5
                cover: true
# rest of blueprint

Then in your template:

<?php foreach ($page->cover()->toFiles()): ?>
  <?php // do stuff ?>
<?php endforeach ?>

You can find all that in the documentation…

1 Like
5

Thank you so much!
It works great :slight_smile: