コレクションページでオプション（バリエーション）一覧を出力するコードが存在しますか？

日本語 ディスカッション 技術的なQ＆A
1

こんにちは。

今現在、以下のような仕様でサイト構築を進めており、不明点があるため、ご教示いただきたいです。

＜想定購入導線＞

①TOPページからシリーズ選択

②シリーズ選択の後、生地色の選択

③商品詳細ぺージ（ここでシリーズと生地色がすでに選択されている状態）

特に②の生地色選択画面では、生地色が選びやすいように、Shopifyのコレクション一覧ページのように色柄が一覧化されたページとして表示させたいです。

商品詳細画面ではアプリを使用の上、生地色柄を画像付きで選択ができることがわかったのですが、この生地色柄だけが表示されている一覧画面の実現は可能でしょうか？

オプション（バリエーション）一覧を出力するコードのようなものが存在すれば、こちらでコードを書くことで実現可能ではと考えております。

他に良い方法があるのをご存じの場合はぜひ教えていただきたいです。

何卒宜しくお願い致します。

2

Nozomi_desu様

ご質問を確認いたしました。

全てのオプションの取得は以下のコードで可能です。

{% for product in collections.all.products %}
  {% for variant in product.variants %}
    {% assign displayedOptions = '' %}
    {% for option in variant.options %}
      {% unless displayedOptions contains option %}
        

{{ option }}

        {% assign displayedOptions = displayedOptions | append: option | append: ',' %}
      {% endunless %}
    {% endfor %}
  {% endfor %}
{% endfor %}

ご参考までに。

3

ご回答ありがとうございました！

いただいたコードを利用して、対応してみます！