スマート検索:フィルター表示設定の構成方法
Display settings フィルターは、スマート検索 アプリで、フィルターがストアフロントにどのように表示されるかをカスタマイズできます。レイアウト、スタイル、表示動作を調整することで、顧客にとってより直感的で使いやすいフィルタリング体験を作り出せます。
この記事では、フィルターの表示設定を構成し、各フィルターがストアフロントでどのように表示されるかをカスタマイズする方法を説明します。
| 注:これらの設定は、デフォルトフィルター と カスタムフィルター の両方に適用されます。 |
フィルター表示設定の構成
フィルター表示設定を構成するには、以下の手順に従ってください。
ステップ 1:表示設定に移動
スマート検索 アプリで、フィルター > デフォルトフィルター または カスタムフィルター に移動し、表示設定 をクリックします。
ステップ 2:スタイル設定の構成
スタイル設定 セクションで、以下を構成します:
-
フィルタースタイル: フィルタースタイルの適用方法を選択します:
- カスタムスタイル: テーマのデフォルトのフィルタースタイルを上書きするカスタム設定を適用します。
- テーマスタイルを適用: ストアテーマで定義されたフィルタースタイルを使用します。
-
カスタムレイアウト: フィルタースタイル で カスタムスタイル を選択した場合、ストアフロントでのフィルターの表示方法をさらに選択できます。
- 垂直: フィルターはサイドバーに表示されます(主にPC版で使用)。
- 左右: フィルターはページの上部に表示されます。
- ドロワー: フィルターはスライドアウトパネルに表示されます(主にモバイルで使用)。
ステップ 3:フィルター表示のプレビュー
フィルタープレビュー セクションで、プレビューするフィルタータイプを選択します:
- デフォルトフィルター
- カスタムフィルター
選択したフィルタータイプによって、個別に設定可能なフィルターが以下に表示されます。
ステップ4:個別フィルター表示の設定
ステップ3で選択したフィルタータイプに基づき、対応するプリセットフィルター条件が表示されます。
その後、各フィルター(例:Price、Color)の表示設定を個別にカスタマイズできます。利用可能なオプションは以下の通りです:
- フィルターの表示:フィルターが失効している場合、非表示となり、プレビューやストアフロントには表示されません。
- フィルタータイプのカスタム名:フィルタータイプのカスタム名を使用して、顧客に表示されるフィルター名をカスタマイズできます。
- このフィルターをデフォルトで閉じる:このオプションを有効にすると、ページ読み込み時にフィルターセクションが閉じた状態になります。
- スタイルタイプ(フィルタータイプによって異なります):利用可能なスタイルオプションはフィルタータイプに依存します。
ステップ5:表示のプレビュー
異なるデバイスでフィルターの表示をプレビューできます。デバイスビューを切り替えてください:
- PC版
- モバイル
これにより、フィルターのレイアウトやスタイルがデバイス間で正しく表示されることを確認できます。
| 注:プレビューは参考用です。実際の表示はテーマやストアフロントの設定によって異なる場合があります。 |
重要な注意事項
- これらの設定は、デフォルトフィルターとカスタムフィルターの両方に適用されます。
- 表示設定はフィルターの見た目にのみ影響し、ロジックや条件には影響しません。
- 利用可能なスタイルオプションはフィルタータイプによって異なる場合があります。
- プレビューは参考用であり、実際のストアフロント表示は若干異なる場合があります。
問題解決:フィルターが正しく表示されない場合
上記のフィルター表示設定を完了しているにもかかわらず、ストアフロントでフィルターが正しく表示されない場合は、以下を確認してください:
テーマエディターでフィルター機能は有効になっていますか?
オンラインストア > デザインに移動してテーマエディターを開きます。次に、カテゴリまたは検索ページに切り替え、フィルターをオンにするトグルが有効になっていることを確認してください。
アプリの衝突はありますか?
スマート検索アプリのカスタムフィルタースタイル機能は、商品フィルタ&カラーチップアプリのフィルタースタイル機能と衝突する可能性があります。両方を同時に適用すると、カテゴリページやすべての商品ページでレイアウトの問題が発生することがあります。衝突を避けるために、どちらか一方のアプリのフィルター機能のみを使用することをお勧めします。
この記事はAIを使用して翻訳されており、不正確な箇所が含まれている可能性があります。最も正確な情報については、元の英語版をご参照ください。