Display order metafield image in Order Printer app

Shopify Apps
1

When I print the packslip of my order, I would like it to include an image that the customer uploaded. The images are stored in the order metafield.

I am trying to display this by editing the template in the Order Printer App. I tried 27 different ways, but none seem to work.

Test 1 {{ metafields.custom.foto_s | file_url }} 

Test 2 {{ metafields.custom.foto | file_url }} 

Test 2 {{ metafields.custom.foto | url }} 

Test 3 {% if order.metafields.custom.foto %}
    
{% else %}
    

No image available

{% endif %}

Test 4 {{ order.metafields.custom.foto | media_tag }}

Test 5 {{ order.metafields.custom.foto }}

Test 6 {% assign image_id = order.metafields.custom.foto %}
{% if image_id %}
    
{% else %}
    

No image available

{% endif %} 

Test 7 {% assign metafield_value = order.metafields.custom.foto %}
{% if metafield_value %}
  Download File
{% endif %}

Test 8 {{ order.metafields.custom.foto | file_reference }}

Test 9 {{ order.metafields.custom.foto | file_url }}

Test 10 {% assign metafield_value = order.metafields.custom.foto | file_url %}
{% if metafield_value %}
  {% assign media = product.media | where: 'id', metafield_value | first %}
  {% if media and media.media_type == 'image' %}
    
    Download File
  {% else %}
    

No valid file found.

  {% endif %}
{% endif %}

{% assign metafield_value = order.metafields.custom.foto | file_url %}
Test1 {{ metafield_value }} 

Test 11 {% for metafields_item in order.metafields.custom.foto %}
  {{metafields_item.reference.MediaImage.image.url  | file_reference}}
{% endfor %}

Test 12 {{ order.metafields.custom.foto.value.url | file_url  }}

Test 13 {{ order.metafields.custom.foto.value.url | file_reference }}

Test 14 {{ order.metafields.custom.foto.value.url }}

Test 15 {{ order.metafields.custom.foto.value }}

Test 16 {{ order.metafields.custom.foto.value | file_url  }}

Test 17 {{ order.metafields.custom.foto.value | file_reference }}

Test 18 {{ order.metafields.custom.foto.value | file_reference }}

Test 19 {{ order.metafields.custom.foto.value }}

Test 20 {{ order.metafields.custom.foto }}

Test 21 {{ order.metafields.custom.foto.value | product_img_url: 'thumb' | img_tag }}

Test 22 {{ line_item.product.featured_image | product_img_url: 'thumb' | img_tag }}

Test 23 {% assign image_url = order.metafields.custom.foto.value %}
{% if image_url != blank %} 
 
{% endif %}

Test 24 {{ order.metafields.custom.foto }}

Test 25 {{ order.metafields.custom.foto.value }}

Test 26 {% if product.metafields.custom.foto %}
     
{% endif %}

Test 27 {{ card_product.metafields.custom.tag_image | img_url: 'master' }}

The result of the code above in html is:

Test 1 //mublio.nl/cdn/shop/files/?3482
Test 2 //mublio.nl/cdn/shop/files/?3482
Test 2
Test 3 Order Image Test 4 Liquid error (line 19): media_tag does not support String
Test 5 gid://shopify/MediaImage/51054247215452
Test 6 Order Image
Test 7 Download File
Test 8 gid://shopify/MediaImage/51054247215452
Test 9 //mublio.nl/cdn/shop/files/gid://shopify/MediaImage/51054247215452?3482
Test 10
No valid file found.

Test1 //mublio.nl/cdn/shop/files/gid://shopify/MediaImage/51054247215452?3482
Test 11
Test 12 //mublio.nl/cdn/shop/files/?3482
Test 13
Test 14
Test 15
Test 16 //mublio.nl/cdn/shop/files/?3482
Test 17
Test 18
Test 19
Test 20 gid://shopify/MediaImage/51054247215452
Test 21 
Test 22 
Test 23
Test 24 gid://shopify/MediaImage/51054247215452
Test 25
Test 26
Test 27 //mublio.nl/cdn/shopifycloud/shopify/assets/no-image-2048-5e88c1b20e087fb7bbe9a3771824e743c244f437e4f8ba93bbf7b11b53f7824c.gif

It seems to me I need a link to the Shopify CDN, like

https://cdn.shopify.com/s/files/1/0615/0927/1744/files/image.jpg?v=1725808787

But I seem only able to this kind of link via de code I tried. Could anybody help me out here?

2

Have you tried

order.metafields.custom.foto.value | image_url

In your test examples, you’ve used product_image_url instead of image_url

3

Hi PaulMartin,

Thanks for your message. I made a new test

Test 28 {{ order.metafields.custom.foto.value | image_url }}

But it returns:

Test 28 Liquid error (line 96): invalid url input
4

Hmmm, how about this one:

{{ order.metafields.custom.foto.value | metafield_tag }}

or this one:

{{ order.metafields.custom.foto | metafield_tag }}
5

Hello Paul, thanks again for your help. I tried both:

{{ order.metafields.custom.foto.value | metafield_tag }}

Returns nothing

{{ order.metafields.custom.foto | metafield_tag }}

Does return

gid://shopify/MediaImage/50918188155228

This is the GID and I need the url to be able the show the image in an tag. Do you have any other ideas?

6

Hi Koennn,

Unfortunately, I’ve ran out of ideas :frowning: Sorry man

7

Thanks for your help so far! Hope somebody else has some experience with this issue.