Shopifyの商品一覧で特定のコレクションの商品の時のみ表示する。

  • URLをコピーしました!

Shopifyで商品詳細ページで、特定のコレクションに属する商品の時のみに表示したい項目があったのですが、handleのみで条件文を書いた場合、

  • コレクションごとのアクセス→表示される
    https://shopify.com/collections/hoge/xxxxxxx
    (URLにコレクションのハンドルが含まれる)
  • 全商品一覧からアクセス→表示されない
    https://shopify.com/collections/all/xxxxxxx
    (URLにコレクションのハンドルが含まれない)

となってしまいました。

試行錯誤の結果、以下のように書いたら希望通りの動作をしたので、備忘録としてメモ。

{%- comment -%}
   - 表示している商品の属するコレクションを全て取得し、該当のコレクション名'hoge'があった場合、
   変数currentCollectionに格納
{%- endcomment -%}

{% for collection in product.collections %}
  		{% if  collection.handle ==  'hoge' %}
     			{% assign currentCollection = collection.handle %}
   		{%- endif -%}
{% endfor %}

{%- comment -%}
   - currentCollection == 'hoge' => 全商品一覧で'hoge'コレクションの商品の詳細を表示した場合
   - collection.handle ==  'hoge' => 'hoge'コレクションの商品一覧で商品の詳細を表示した場合
{%- endcomment -%}  
{% if currentCollection == 'hoge' or collection.handle ==  'hoge' %}
     <div class="product__item">
          <p>コレクションがhogeの場合、この部分が表示されます。</p>
     </div>
{%- endif -%}

合っているかどうかは分からないので、よりスマートな書き方ご存知の方いたらご教示いただけると嬉しいです。

よかったらシェアしてね!
  • URLをコピーしました!

この記事を書いた人

神奈川生まれ沖縄育ちの88年生まれ。WEB制作3年目。
31歳まで舞台俳優を目指して活動していましたが、将来が不安になり未経験からWEB制作業界へ。
現在はWEB制作会社で働いています。たまに演劇経験を活かしてイベントスタッフも。

目次