skip to Main Content

I have created a custom section in a shopify theme. Within the {%schema%} tags, this is my code:

{% schema %}
 {
     "name": "about",
     "settings": [
                    {
                        "type": "text",
                        "label": "Heading",
                        "id": "heading"
                    },
                    {
                        "type": "richtext",
                        "label": "description",
                        "id": "description"
                    }

                ],
        "blocks" : [
            {
                "type": "image",
                "name" : "image block",
                "settings" : [
                    {
                        "type": "image_picker",
                        "label": "your image",
                        "id" : "image"
                    }
                ]
            }
        ],
    "presets": [{
    "name": "about",
    "category": "image",
        }]
    }
}
 {% endschema %} 

Text and richtext work fine as well as the option to upload an image, however the image does not render on the page. It just displays the typical image not found icon.

Here is how I am trying to display the image:

{% for block in section.blocks %}
    <img src="{{ block.settings.image | image_url:'master'}}"/>
{%endfor%}

I have even tried uploading the ‘free images’.

2

Answers


  1. Change the | image_url filter to | img_url

    Login or Signup to reply.
  2. Try image_url only

     <img src="{{ block.settings.image | image_url }}"/>
    
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search