Displaying image file from blueprints file field

Archive
1

I have declared following custom field in themes blueprint:

header.object_photos:
              name: photos
              type: list
              label: Photos
              fields:
                .custom_file:
                  type: file
                  label: Photo
                  multiple: false
                  destination: 'self@'
                  random_name: false
                  avoid_overwriting: false
                  filesize: 50
                  accept:
                    - image/*
                .description:
                  type: text
                  label: Description

And I’m trying to loop trough that list, to display image and description in my template. Description works nicely, but I’m havind trouble with image:

{% if page.header.object_photos %}                     
   {% for image in page.header.object_photos %}
      {{ image.custom_file.cropResize(500, 70).html() }}
      {{ image.description }}
   {% endfor %}
{% endif %}

When I look at my page’s markdown file, then there I have picture files path.

object_photos:
    -
        description: Test1
        custom_file:
            user/pages/01.Kodu/korterelamu-roosikrantsi-8b/roosikrantsi.jpg:
                name: roosikrantsi.jpg
                type: image/jpeg
                size: 2467042
                path: user/pages/01.Kodu/korterelamu-roosikrantsi-8b/roosikrantsi.jpg
---
2

I think you need to get the image from the page media:

{% if page.header.object_photos %}                     
   {% for image in page.header.object_photos %}
      {{ page.media[image.custom_file].cropResize(500, 70).html() }}
      {{ image.description }}
   {% endfor %}
{% endif %}
---
3

Thanks! Description part seems to work, but i’m getting an error for:

{{ page.media[image.custom_file].cropResize(500, 70).html() }}

An exception has been thrown during the rendering of a template (“Illegal offset type in isset or empty”) in “partials/base.html.twig” at line 158.

Seems like media needs quotation marks inside the squared brackets?

4

try dumping the file to make sure the filename is as expected:

{{ dump(image.custom_file) }}

Then make sure that filename exists on this page. I think you are getting null or "" for that value though, hence the illegal offset.

5

@rhukster – Tried dumping custom_file. And result was null like you said.
How should I fix it?

6

Mhm, not sure right now if it works, but try:

{{ dump(image.custom_file|first) }}
---
7

@ponderboy – nope. I’m getting ""
Is it working at all with images placed in lists?

8

I’d say yes. I don’t have the time to dig into deeply. Another quick snippet from one of my partials:

{% if page.header.object_photos %}                     
   {% for image in page.header.object_photos %}
      {% set file = image.custom_file|first %}
      {{ dump(file.name) }}
      {{ page.media[file.name].cropResize(500, 70).html() }}
      {{ image.description }}
   {% endfor %}
{% endif %}
---
9

Thanks man! Got this thing finally working.