Dynamic header block without structure-field?

, ,
1

Hello everyone,

I’m trying to create a Header-Block, like the one shown in the attached screenshots.

previewheaderblck
previewheaderblck1920×574 48.2 KB

I’ve searched the documentation and forums, but I can’t seem to find a straightforward solution. I did achieve this behaviour with a structure-field but this isn’t really that user friendly.

structure
structure1566×468 4.35 KB

header-drawer
header-drawer1128×1224 82.5 KB

This is in my opinion a better way to display it, now could someone please point me in the right direction or provide some guidance on how to achieve this Idea? Is this possible with Kirby’s internal Blueprints or is the only way a Custom Field Plugin?

Thanks in advance for your help.

2

why not use a files field and set any further necessary data in the file blueprints.

blueprint/pages/default.yml

sections:
  content:
    type: fields
    fields:
      headerimages: # set/upload files
        type: files
        layout: cards
        uploads: headerimages
        info: "{{ file.linktoproject.toPage.title }}"
  allfiles:
    type: files # to be able to delete files

blueprint/files/headerimages.yml

accept: image/jpeg, image/png
fields:
  linktoproject:
    type: pages
    max: 1
  alt:
   type: text
   maxlength: 140
3

Well as you can see in the last screenshot, it is about having multiple headers containing
each two layout fields… and switching between/or hiding these headers, respectively the fields, with the selector at the top [ 1 , 2 , 3 , + ]

The most important thing here is the usability and simplicity for the customers. For myself, the solution that I have now with the structure field would have been totally sufficient, or the solution that you described there.

So basically the problem is this selector on top, that I don’t know how I can get it to dynamically switch between fields, and also add dynamically new fields, just like a structure field

4

this would be some work but extending the blocks field to have the numbers and + on top and working like a slider (the 1-2-3-+ thing you have in your mockup, instead of the usual list). then have only one custom block inside that new “slider-blocks” field that shows the image and has the headline/subheadline editable.

using blocks makes it easier to define the preview for multiple values combined. structure previews are for one value only so thats no good here.