Shopify部分-将背景图片添加到特定页面

Question

我网站上大多数页面的顶部都有一个“英雄”区域。这些区域包含页面标题+一小段文字。每个页面应具有自己的唯一图像，管理员可以在CMS中指定该图像。

当我创建一个包含image_picker的部分以及一个下拉菜单以选择图像所在的页面/集合时，我以为我可以进行此工作。我上传了一张图片，效果很好！

但是，在移到另一个集合时，有一个“未找到图像”占位符图像...因此，我需要编写代码，因此，如果未上传任何图像，则不会添加任何内容。但是然后，如果我将图像上传到该收藏集就可以了，但是我以前在页面上添加了图像以停止工作。

所以我想我的页面选择不起作用！

有人能对此有所启发吗？

这是部分代码：

{% for block in section.blocks %}
    {% if collection.handle == block.settings.collection %}

        {% assign image = block.settings.image %}

    {%- endif -%}
{% endfor %}

<div class="masthead" style="background-image: url( {{ image | img_url: 'master' }});">
    <div class="wrap wrap--narrow">

        <h1 class="masthead__title">{{ collection.title }}</h1>
        {% if collection.description != blank %}
        <div class="rte">
            <p class="masthead__text">{{ collection.description }}</p>
        </div>
        {% endif %}

    </div>
</div>

{% schema %}
  {
    "name": "Masthead",
    "settings": [],
    "blocks": [
      {
        "type": "store",
        "name": "Background Image",
        "settings": [
            {
            "id": "image",
            "type": "image_picker",
            "label": "Masthead Image"
          },
          {
            "id": "collection",
            "type": "collection",
            "label": "Choose Page"
          }
        ]
      }
    ],
    "presets": [
    ]
  }
{% endschema %}