Query Images in Image Block

Kirby 3 Solved ✅
1

Hi!

I’m trying to use the query option from the files field inside the image block of the blocks editor. Is there a way to achieve this?
This is what I tried so far, but it doesn’t work. In the site-blueprint i defined a files section called gallery. Ins the blueprint of the page containing the blocks editor I tried this:

text:
  label: Text
  type: blocks
  fieldsets:
    - text
    - image
    - markdown
    - video
    - list
    - heading
    image:
      extends: blocks/image
      query: site.gallery
2

Is this a files field in the site object?

Then you have to convert it to a files object

site.gallery.toFiles

Otherwise, please state your problem more specifically.

3

Hi!

Yes, gallery is a field in the site object. In my site.yml I have:

    sections:
      gallery:
        width: 1/2
        label: Globale Bilder
        type: files
        template: gallery

and in my page blueprint i defined the new block like this:

          selectimage:
            extends: blocks/image
            query: site.gallery.toFiles
            name: Select Image...

But when i add this block, I can only select images uploaded to the specific page…

4

This cannot possibly work, toFiles() is a method you call on a files field, but you are using a section. The sole purpose of a section is to upload files to a page/the site object, which you can later retrieve with

$site->images()

or when you have assigned a template with

$site->images()->template('gallery')

Hence

selectimage:
            extends: blocks/image
            query: site.images.template('gallery')
            name: Select Image...
5

Unfortunately, I cannot make this work.

In my site.yml I have a section and a field now:

sections:
      fields:
        type: fields
        fields:
          upload:
            type: files
            template: globalimage
      gallery:
        width: 1/2
        label: Globale Bilder
        type: files
        template: globalimage

But neither

selectimage:
            extends: blocks/image
            query: site.images
            name: Select Image...

nor

selectimage:
            extends: blocks/image
            query: site.images.template('globalimage')
            name: Select Image...

nor

selectimage:
            extends: blocks/image
            query: site.upload.toFiles
            name: Select Image...

works.

What’s strange is, that on the same blueprint I have a normal files field that looks like this:

      myimagefield:
        type: files
        query: site.images
        uploads:
          parent: site

And there it works fine. Only in the block I cannot make it work… I updated Kirby to 3.9.1 but still no change… Is there something else I’m missing here?

6

Can you please post the complete site.yml?

7

Sure!

title: Site

columns:
  - width: 1/2
    sections:
      allPages:
        width: 1/2
        headline: Pages
        type: pages
        query: site.children.listed
        image: false
        templates:
          - forum
          - aktuell
          - kalender
          - personen
  - width: 1/2
    sections:
      fields:
        type: fields
        fields:
          upload:
            type: files
            template: globalimage
      gallery:
        width: 1/2
        label: Globale Bilder
        type: files
        template: globalimage
8

And the part where you are querying the site’s images? Is that in a different blueprint?

9

Yes, that is a different blueprint. It’s the blueprint for posts in a blog, where I use the blocks editor. Here i define the blocks (the blueprint is very long, so I’m just pasting the blocks part here):

      text:
        label: Text
        type: blocks
        fieldsets:
          - text
          - image
          - markdown
          - video
          - list
          - heading
          selectimage:
            extends: blocks/image
            query: site.images
            name: Select Image...
            uploads:
              parent: site
          columns:
            extends: blocks/columns
            fields:
              layout:
                layouts:
                  - "1/2, 1/2"
                fieldsets:
                  - heading
                  - text
                  - image
                  - list
10

Just in case, here is the whole blueprint:

post.yml

title: Post

columns:
  - width: 2/3
    fields:
      subheadline:
        type: text
        label: Unterüberschrift
      categories:
        width: 1/2
        type: multiselect
        label: Tags (Aktuelles)
        options:
          type: query
          query: site.find("aktuell").tags.toStructure
          text: "{{ item.tagname }}"
          value: "{{ item.tagname }}"
      eventcategories:
        width: 1/2
        type: multiselect
        label: Veranstaltungstags
        options:
          type: query
          query: site.find("kalender").tags.toStructure
          text: "{{ item.tagname }}"
          value: "{{ item.tagname }}"
      previewtext:
        width: 1
        type: textarea
        size: small
        label: Vorschau Text
      text:
        label: Text
        type: blocks
        fieldsets:
          - text
          - image
          - markdown
          - video
          - list
          - heading
          selectimage:
            extends: blocks/image
            query: site.images <----- This doesnt work...
            name: Select Image...
            uploads:
              parent: site
          columns:
            extends: blocks/columns
            fields:
              layout:
                layouts:
                  - "1/2, 1/2"
                fieldsets:
                  - heading
                  - text
                  - image
                  - list
      htmlfield:
        type: textarea
        label: HTML Feld (Newsletter)
  - width: 1/3
    fields:
      myimagefield:
        type: files
        query: site.images <----- This works!!
        uploads:
          parent: site
      coverimage:
        label: Cover Bild
        type: files
        query: site.images <----- This works too!!
      startdate:
        label: Datum / Uhrzeit
        width: 1/2
        type: date
        time: true
      enddate:
        label: Datum Beginn
        width: 1/2
        type: hidden
        time: true
      location:
        type: text
        label: Location
      serif:
        type: select
        label: Serifen
        options:
          serif: Serif Font
          noserif: Noserif Font
      publish_in_aktuelles:
        type: toggle
        default: false
        label: In Aktuelles veröffentlichen (Veranstaltungen)
      festival:
        type: multiselect
        max: 1
        label: Verlinktes Festival
        options:
          - Festival 2019
          - Festival 2021
          - Forum
      personen:
        label: Verlinkte Personen
        type: multiselect
        options:
          type: query
          query: site.find("personen").children
          text: "{{ page.title }}"
          value: "{{ page.uuid }}"
      cooperations:
        type: structure
        label: Förderungen / Kooperationen
        fields:
          cooperationtype:
            type: text
            label: Art der Förderung / Kooperation
          singlecoops:
            label: Institutionen
            type: structure
            fields:
              coverimage:
                label: Logo Image
                type: files
                multiple: false
                query: site.images
                uploads:
                parent: site
              cooptitle:
                label: Name
                type: text
              coopurl:
                label: URL
                type: url
      downloadable:
        label: Downloads
        type: files
      supporters:
        type: hidden
        label: Förderer
        options:
          type: query
          query: site.find("forderer").children
          text: "{{ page.title }}"
          value: "{{ page.uuid }}"
      created:
        label: Erstellungsdatum
        type: date
        time: true
        default: now
11

That query cannot possibly work because you are applying in on the block type instead of on the field in the block type. Better create a new yaml file for your new block, that will make it clearer.

12

That did the trick, thanks a lot. I thought I could just add the query to the block, but it makes sense that you have to add it to the correct field.

Thank you once again for your continuously support!!