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

【Dawn】Shopifyのテーマ「Rise/Dawn」で閲覧履歴セクションを表示する設定例

【Dawn】Shopifyのテーマ「Rise/Dawn」で閲覧履歴セクションを表示する設定例

用途

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

実装方法

  • HTML/CSS
詳細を表示する

Shopifyのテーマ「Dawn/Rise」には標準で商品閲覧履歴が無いので、特集コレクションセクションをベースにjsのlocalStrageとliuidのcart.attributesを使って閲覧履歴セクションを実装する際の設定例です。liquidの制約で最大20件まで表示可能です。


Shopifyのテーマ「Rise/Dawn」で閲覧履歴セクションを表示する設定例


【(テーマRise/Dawnの場合)設定方法①】新規セクションを作成し、特集コレクションの中身を複製


【(テーマRise/Dawnの場合)設定方法②】sections/recently-viewed-collection.liquidの中身を修正


【(テーマRise/Dawnの場合)設定方法③】layout/theme.liquidの直前にコードを追加し、テーマエディタでセクションを追加


【補足】Shopifyのテーマ「Rise/Dawn」でカスタマイズした閲覧履歴セクションを使って「最近見た商品」セクションを設置した際、そのままだと購入時に履歴が「追加の詳細」に入ってくるので表示したく無い場合の設定例


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

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

サンプルコード

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

sections/recently-viewed-collection.liquidの中身を修正:①

sections/recently-viewed-collection.liquidの中身を修正:②

関連ポスト

その他のHTML/CSSに関するTIPS