商品情報にスキップ
1 1
公開日:2024.02.07

Shopifyのテーマ「Dawn」の複数バリエーションを持つ商品のコレクションページでデフォルト以外のバリエーションを指定して表示させる方法

Shopifyのテーマ「Dawn」の複数バリエーションを持つ商品のコレクションページでデフォルト以外のバリエーションを指定して表示させる方法

用途

  • コレクション情報管理・編集

実装方法

  • LIQUID
詳細を表示する

Shopifyのコレクションページに複数のバリエーションを持つ商品を掲載する際、デフォルトではない特定カラーの商品を最初から表示しておきたいケースがあります。テーマ「Dawn」で、コレクションメタフィールドを使って任意のバリエーション値を指定して表示する設定例です。


テーマ「Dawn」の複数バリエーションを持つ商品のコレクションページでデフォルト以外のバリエーションを指定して表示させる方法


【設定方法①】custom.variant_key」「custom.vaiant_value」と命名した2種類の単一行テキストによるコレクションメタフィールドを作成


【設定方法②】card-product.liquid」修正その1:冒頭部分を修正


【設定方法③】card-product.liquid」修正その2:商品リンクURLにコードを追加


ご購入(すべて¥0です)いただくと、サンプルコードをご覧いただけるようになります。

すでにご購入済みの方はこちらからログインしてください。

サンプルコード

動作検証済テーマ:Dawn/Rise 15.2.0

「card-product.liquid」修正その1:冒頭部分を修正

関連ポスト