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

Shopifyのテーマ「Dawn」で商品ページにランキング枠を設置する設定例

Shopifyのテーマ「Dawn」で商品ページにランキング枠を設置する設定例

用途

  • 商品情報管理・編集

実装方法

  • LIQUID
  • HTML/CSS
詳細を表示する

ShopifyのテーマDawnの「特集セクション」を拡張して、ランキング枠として使う方法ですが、商品ページにももちろん実装可能です。関連商品とあわせて「その商品が含まれるカテゴリのランキング」を表示しておけば、類似商品の閲覧率を高める効果が期待できます。

テーマ「Dawn」で商品ページにランキング枠を設置する設定例


設定手順①:商品フィールドに定義を追加し、対象商品でコレクションを指定。「featured-collection.liquid」にschemeを「ja.schema.json」にラベルを追加


設定手順②「featured-collection.liquid」のコードを修正


設定手順③:商品テンプレートの任意の場所に「特集コレクション」セクションを追加し各種設定を行う


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

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

サンプルコード

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

「featured-collection.liquid」にschemeを追加


「ja.schema.json」にラベルを追加


「featured-collection.liquid」のコードを修正(参照先のコレクションに「動的ソース」が設定されていた場合に中身がない場合、および2ページ目以降は非表示とするための処理)