ねえ、私は私のshopifyウェブサイトでブルックリンテーマを使用しています。色違いの商品があります。コレクションページをクリックすると、その商品のすべてのカラーバリエーションを個別の商品として表示したいと思います。私は昨夜からグーグルしています。助けてください。
以下のコードを見てください。
<ul class="colorlist">
{% for option in product.options %}
{% if option == 'Color' %}
{% assign index = forloop.index0 %}
{% assign colorlist = '' %}
{% assign color = '' %}
{% for variant in product.variants %}
{% capture color %}
{{ variant.options[index] }}
{% endcapture %}
{% unless colorlist contains color %}
{% if variant.available %}
<li id="{{ variant.id }}" title="{{ variant.inventory_quantity }} In Stock" class="instock"><a href="{{ product.url | within: collection }}?variant={{ variant.id }}" style="background:{{ color | downcase }}">{{ color | downcase }}</a></li>
{% else %}
<li id="{{ variant.id }}" title="Out of Stock" class="outstock" >{{ color | downcase }}</li>
{% endif %}
{% capture tempList %}
{{colorlist | append: color | append: " " }}
{% endcapture %}
{% assign colorlist = tempList %}
{% endunless %}
{% endfor %}
{% endif %}
{% endfor %}
</ul>
上記のコードは、コレクションページで商品の利用可能な色を表示できます。バリアント名だけを表示するのではなく、同じループ構造を使用して製品グリッド全体を表示できます。
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加