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

Shopifyのテーマ「Rise/Dawn」のコレクションページで「タグによる絞り込み(詳細な絞り込み)」で不要なタグを非表示にする設定例:その2

Shopifyのテーマ「Rise/Dawn」のコレクションページで「タグによる絞り込み(詳細な絞り込み)」で不要なタグを非表示にする設定例:その2

用途

  • コレクション編集

実装方法

  • HTML/CSS
詳細を表示する

こちらの設定方法は直接コードに除外するタグを記述する方法でしたが、運用を開始するとコード編集はしたくないものですね。というわけで、テーマ「Rise/Dawn」のエディタ上で除外したいタグを随時追加・削除・編集できるようにする方法です。

◆設定のメリット
・テーマエディタ上でタグの編集が可能。

◆具体的な設定手順
①「sections/main-collection-product-grid.liquid」にschemeを「ja.schema.json」にラベルを追加
②「sections/main-collection-product-grid.liquid」に絞り込み設定snippetsに指定したタグリストを渡す引数を追加
③「snippets/facets.liquid」に除外するタグの読み込み、デスクトップ用・モバイルドロワー用のフィルタに除外処理を追加


テーマ「Rise/Dawn」のコレクションページで「タグによる絞り込み(詳細な絞り込み)」で不要なタグを非表示にする設定例②


【(テーマRise/Dawnの場合)設定方法①】「sections/main-collection-product-grid.liquid」にschemaを「ja.schema.json」にラベルを追加


【(テーマRise/Dawnの場合)設定方法②】「sections/main-collection-product-grid.liquid」にコードを追加(絞り込み設定snippetsに指定したタグリストを渡す引数を追加)


【(テーマRiae/Dawnの場合)設定方法③】「snippets/facets.liquid」にコードを追加(除外するタグの読み込み、デスクトップ用・モバイルドロワー用のフィルタに除外処理を追加)


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

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

サンプルコード

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

「sections/main-collection-product-grid.liquid」にschemaを追加

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

関連ポスト