我已将一张图片上传到设置=>文件,并希望将其作为可点击的变体形式出现在每个产品页面中。我已经成功地使它能够显示为每个产品的变体,但是当我单击它来替换特色图像时,它不会显示。
<!-- Begin #product-image -->
<div id="product-image" class="col-sm-5 product-image">
<div class="product-image-inner row">
{% if product.images.size > 0 %}
{% assign featured_image =
product.selected_or_first_available_variant.featured_image | default: product.featured_image %}
<a href="{{ featured_image | product_img_url: 'original' }}" class="featured-image elevatezoom">
<img id="product-featured-image" class="magniflier zoom-image" src="{{ featured_image | product_img_url: '1024x1024' }}" data-zoom-image="{{ featured_image | product_img_url: 'original' }}" alt="{{ product.title | escape }}" />
</a>
<div class="more-view-image">
<ul id="gallery-image" class="gallery-image-thumb">
{% for image in product.images %}
<li>
<a class="thumb-img{% if forloop.index == 1 %} active{% endif %}" data-image="{{ image | product_img_url: '1024x1024' }}" data-zoom-image="{{ image | product_img_url: 'original' }}">
<img src="{{ image.src | product_img_url: 'small' }}" alt="{{ product.title | escape }}">
</a>
</li>
{% endfor %}
<li><a data-image="{{ '1.jpg' | product_img_url: '1024x1024' }}" data-zoom-image="{{ image | product_img_url: 'original' }}">
<img src=" {{ '1.jpg' | file_url }}" alt="{{ product.title | escape }}">
</a></li>
</ul>
</div>
{% else %}
<img src="{{ 'default-image.jpg' | asset_url }}" />
{% endif %}
</div>
</div>
<!-- End #product-image /- -->