Sub folder organisation

Kirby 4
1

Hi All,

I’m trying to figure out how to sort images in a subfolder in the panel.
I have a website I’m building and need some help with the panel. I have two sections on my page one which simply displays images and another which loads them into lightboxes. As such I have put the general images in the project folder and the lightbox into a child folder.

The issue Is I can load the images into the panel under the project page but I cannot sort them.

project
	project.txt
	image 1
	image 2
	child folder
		image 1
		image 2
		image 3

This is how the images from the child folder appear in the panel but there are no handles to re-order them

Screenshot 2024-11-13 at 14.37.02
Screenshot 2024-11-13 at 14.37.022026×766 136 KB

This is my project.yml

title: Project

sections:
  intro:
    type: fields
    fields: 
      title:
        type: text
      location:
        type: text
      intro:
        type: text
  gallery:
    type: files
    sortable: true
  body:
    type: fields
    fields: 
      description:
        type: textarea
      information:
        type: structure
        entry: "{{point}}"
        fields:
          point:
            label: Bullet Point
            type: text
  drawings:
    type: files
    layout: cards
    sortable: true
    query: page.find("drawings").files
2

Rather than using the query property which prevents manual sorting (pages can be from anywhere), use the parent property:

 drawings:
    type: files
    layout: cards

    parent: page.find("drawings")

If the files in drawings and gallery are supposed to be different, it might make sense to have all files in the same folder (the parent) and assign different templates per section to differentiate between the two sets of files.

3

Thanks for this texnixe, I have updated the code and it gave me the handles back however when I try to move the cards I get an error message

“The section “drawings” could not be found”

4

Hm, that’s weird. Is the indentation correct?

5

I believe so, this is my full yml file

title: Project


columns:
  - width: 1/2
    sections:
      location:
        type: fields
        fields: 
          location:
            type: text

  - width: 1/2
    sections:
      intro:
        type: fields
        fields: 
          intro:
            type: text
  - width: 1/1
    sections:
      gallery:
        help: "Provide the name or source for image credit. For more information, [click here](https://example.com)."
        type: files
        sortable: true
        layout: cards
        info: "{{ file.width }} x {{ file.height }}"
        size: large
        
  - width: 1/2
    sections:
      body:
        type: fields
        fields: 
          description:
            type: textarea
          information:
            type: structure
            entry: "{{point}}"
            fields:
              point:
                label: Bullet Point
                type: text

  - width: 1/2
    sections:
      drawings:
        type: files
        layout: cards
        parent: page.find("drawings")
        info: "{{ file.width }} x {{ file.height }}"
6

Yes, I can reproduce this, sorting works via the drop-down option, but drag&drop fails as you describe.

7

Ok good to know its not just me doing something wrong. Could you tell me how I enable the drop down? Thanks