Question

我正在尝试找到一种方法来使图像显示为集合特色图像。我能够成功显示图像但无法访问图像的正确位置。

{% if template == 'index' %}
{% for frontpage in collections %}
<h2>{{ frontpage.title }} Collection</h2>
      {% if frontpage.image %}
        <a href="collections/{{ frontpage.handle }}"><img src="{{ frontpage.image.src | frontpage_img_url: 'medium' }}" /></a>
      {% else %}
        <img src="{{ frontpage.collections.first.featured_image | product_img_url: 'large' }}" alt="{{ frontpage.title | escape  }}" />
      {% endif %}
{% endfor %}
 {% else %}

{% endif %}

图片链接显示为 /collections/test-product.png 我需要它显示为 https://cdn.shopify.com/s/files/1/0593/8633/collections/test-product_small.png?v=1406487979 。我怎样才能让它发挥作用？

Answer 1

Shopify wiki上的

This article给出了如何显示集合特色图片的示例：

{% if collection.image %}
    {{ collection.image.src | collection_img_url: 'medium' | img_tag: collection.title }}
{% else %}
    {{ collection.products.first.featured_image.src | product_img_url: 'medium' | img_tag: collection.title }}
{% endif %}

另请参阅collection.image的文档：

返回集合图像。使用collection_img_url过滤器将其链接到Shopify CDN上的图像文件。

collection.image.src：

返回集合图像的相对URL。

在您的代码中，使用collection_img_url代替frontpage_img_url。

您还应该尝试frontpage.products.first.featured_image.src而不是frontpage.collections.first.featured_image。

根据特定集合显示图像

1 个答案: