バリエーションがある商品を各バリエーションとも一覧ページへ表示したい

フリーのテーマをベースに利用して制作する前提です。
カラーバリエーションがある商品(例えば、「TシャツA」という商品名で白、黄、赤、青の色違いがある)を各色全て商品一覧ページに表示したいのですが、そういった事はできますでしょうか?
白だけでなく、黄色や赤のTシャツも一覧ページに並列に表示されているイメージです。

ご教授いただけますと幸いです。よろしくお願いいたします。

私も得意ではない分野ですが、基本はLiquidでの編集になると思います。
トップページの商品一覧で、カラーバリエーションを一覧で表示したいってことですよね?
Liquid 構文タグ で、Variants をLoopすればできるようです。

テーマのコード編集 で、Product一覧を表示するところに、例えば、以下のようなコードを入力します。 (テーマによって違う)

{% for tag in collection.all_tags %}
{% capture current_tag %}/{{ tag }}/{% endcapture %}
	<div class="small-12 columns cat-divider"></div>
	<div class="small-12 columns cat-title">
		<h3 class="lowercase">{{ tag }}</h3>
	</div>
	{% for product in collection.products %}
		{% for product_tag in product.tags %}
		{% capture current_tag2 %}/{{ product_tag }}/{% endcapture %}
			{% if current_tag contains current_tag2 %}
					{% assign seen_variants ='' %}
				
					{% for variant in product.variants %}
						{% assign variant_options = '' %}
						{% unless product.options[0] == 'Size' %}
							{% assign variant_options = variant_options | append: ",," | append: variant.option1 %}
						{% endunless %}
						{% unless product.options[1] == 'Size' %}
							{% assign variant_options = variant_options | append: ",," | append: variant.option2 %}
						{% endunless %}
						{% unless product.options[2] == 'Size' %}
							{% assign variant_options = variant_options | append: ",," | append: variant.option3 %}
						{% endunless %}
				
						{% assign variant_options = variant_options | replace: ",,", " " | strip %}
				
						{% unless seen_variants contains variant_options and seen_variants != '' %}
							{% assign seen_variants = seen_variants | append: ",," | append: variant_options %}
							{% include 'product-list-single' with collection.handle %}
						{% endunless %}
					{% endfor %}
			{% else %}
			{% endif %}
		{% endfor %}
	{% endfor %}
{% endfor %}

タグ参考

あと、調べたら、こちらのShopipy APPでも同じように使えそうです。

他、Shopify詳しい人いたら補足お願いしますー

「いいね!」 1

返信が遅れ失礼いたしました。

つばささん、情報ありがとうございます!
試してみます!

「いいね!」 1

いえいえ、気にしてないですよー。
ぜひ、試してみてくださいね^^