SXA 検索フィルター コンポーネントの使用

Version: 10.1
日本語翻訳に関する免責事項

このページの翻訳はAIによって自動的に行われました。可能な限り正確な翻訳を心掛けていますが、原文と異なる表現や解釈が含まれる場合があります。正確で公式な情報については、必ず英語の原文をご参照ください。

SXA は、Web サイトの訪問者が検索結果を絞り込むためのフィルター コンポーネントをいくつか付属しています。このトピックでは、さまざまなフィルターを使用する方法について説明します。

ツールボックスの検索セクションには SXA 検索フィルターがあります。
注記

ほとんどの検索フィルターでは、検索結果のシグネチャを設定できます。フィルター コンポーネントのプロパティで、特定の検索結果レンダリングの一意のシグネチャを入力して、検索結果を制限できます。これは、同じページで複数の検索を行う場合に便利です。

集計ファセット フィルター コンポーネントの使用

集計ファセット フィルター コンポーネントを使用すると、複数のフィルターを組み合わせることができます。たとえば、メディア サービス プロバイダーの訪問者がタイプ (テレビ シリーズ、ドキュメンタリー、映画など) とジャンル (サイエンス フィクション、ホラー、コメディなど) でフィルターできるようにしたい場合があります。

集計ファセット フィルター コンポーネントを設定して追加するには、次の手順に従います。

  1. コンテンツ エディターで、sitecore/Content/<Tenant>/<Site>/Presentation/Rendering Variants/Aggregated Facet Filter にナビゲートし、レンダリング バリアントを追加します。たとえば、バリアントを追加して、「集計フィルター バリアント」と名前を付けます。

  2. これで、バリアントにフィルターを追加できます。レンダリング バリアントを右クリックし、[挿入] をクリックして [コンポーネント] をクリックします。

  3. [バリアントの詳細] セクションの [レンダリング アイテム] フィールドで、フィルターを選択します。たとえば、ドロップダウン フィルター Renderings/Feature/Experience Accelerator/Search/Filter (Dropdown) を追加します。

  4. アイテムを保存します。

  5. [バリアントの詳細] セクションの [レンダリング パラメーター] フィールドをクリックし、[設定] をクリックします。

  6. [一般] セクションの [データ ソース] フィールドで、[参照] をクリックしてデータ ソースを選択します。

    たとえば、フルーツ サイズ を選択します。

    フィルターのデータ ソースを選択します。

    同じ手順を使用して、他のフィルターを追加できます。

  7. 検索結果コンポーネントと集計ファセット フィルター バリアントの両方をエクスペリエンス エディターのページに追加すると、訪問者は複数のフィルターを同時に使用してサイトを検索できます。

    集計ファセット フィルターで複数のフィルターを組み合わせる

    たとえば、フルーツ サイズのチェックリスト フィルターとフルーツの味のドロップダウン フィルターを含む集計ファセット フィルターを使用し、中サイズとサワー味を選択すると、次の検索結果が表示されます。

    集計ファセット フィルターの結果

ファセット サマリー コンポーネントの追加

ファセット サマリー コンポーネントを使用して、アクティブなフィルターをページに表示し、訪問者がそれらを 1 つずつまたはまとめて削除できるようにします。

ファセット サマリー コンポーネントを追加するには、次の手順に従います。

  • ツールボックスから、ファセット サマリー コンポーネントをページにドラッグします。既定では、ファセット サマリー コンポーネントにはフィルターのタイトル、選択したフィルターとフィルターの削除テキスト、すべてのファセットをクリアが含まれます。[ファセット サマリー] ツールバーの歯車をクリックしてラベルを編集します。

    ファセット サマリー フィルターには、すべてのアクティブなフィルターが一覧表示されます。

    たとえば、フルーツのサイズ、味、色に関するフィルターがページに含まれていて、ファセット サマリー コンポーネントを追加した場合、訪問者は該当する [X] をクリックしてフィルターを個別に削除することも、[すべてのファセットをクリア] をクリックしてすべてのフィルターを削除することもできます。

    ファセット フィルターの結果: [X] をクリックしてフィルターを削除します

フィルター (チェックリスト) コンポーネントの追加

フィルター (チェックリスト) コンポーネントは、チェックリストで選択された値に基づいて検索結果をフィルター処理します。たとえば、サイズで商品を検索するには、次の手順に従います。

サイズでフィルター処理するチェックリスト フィルターの例

フィルター (チェックリスト) コンポーネントを追加するには、次の手順に従います。

  1. ツールボックスからページにフィルターをドラッグし、[フィルター (チェックリスト)] ツールバーで歯車をクリックして、フィルター処理するファセットを設定します。

  2. 次のフィールドを編集できます。

    歯車をクリックして、チェックリストのフィルター設定を変更します

    フィールド

    説明

    ファセット

    フィルター処理するファセットを選択します。

    フィルター タイトル

    フィルターのタイトルとして表示するテキストを入力します。

    しきい値さらに表示展開テキスト

    より多くのファセットを表示するためのラベルのテキストを入力します。

    しきい値表示数を減らす展開テキスト

    より少なくファセットを表示するためのラベルのテキストを入力します。

    しきい値セクションの区切り文字 その他

    特定のコンポーネント設定で使用するその他ラベルのテキストを入力します。

    ボタンのラベル

    フィルターをトリガーするボタンのラベルのテキストを入力します。

    空の値のテキスト

    名前のないファセットに表示されるテキストを入力します。

    フィルターの削除のテキスト

    フィルターを削除するボタンのラベルのテキストを入力します。

  3. [フィルター (チェックリスト)] ツールバーで、[詳細] をクリックし、[コンポーネント プロパティを編集する] をクリックして、[FilterCriteria] セクションにフィルターの詳細を指定します。

    フィールド

    説明

    並べ替え順序

    ファセットの並べ替え方法を決定します。たとえば、名前または数で並べ替えます。

    強調表示しきい値

    強調表示される結果数を指定します。

    その他セクションの上限

    指定すると、フィルター内の値がこの値に絞り込まれ、[さらに表示] ボタンが表示されます。たとえば、フィルターで (全) 15色が表示され、このパラメーターを「2」に設定した場合、最初の 2 色のみが表示されます。さらに表示するには、[さらに表示] をクリックする必要があります。

    選択時に折りたたむ

    選択すると、選択されていないファセットは表示されません。

    複数選択

    選択すると、検索に複数のファセットを選択できます。

フィルター (日付) コンポーネントの追加

フィルター (日付) コンポーネントを使用すると、選択した日付の検索結果をフィルター処理できます。たとえば、ブログ ページの場合、時間ベースのフィルターを用意することで、訪問者が最近の投稿にフィルターをかけたり、特定の期間の投稿だけを見たりすることができます。

フィルター (日付) コンポーネントを追加するには、次の手順に従います。

  1. ツールボックスからページにフィルターをドラッグし、[フィルター (日付チェックリスト)] ツールバーで歯車をクリックして、フィルター処理するファセットを設定します。

  2. 次のフィールドを編集できます。

    フィールド

    説明

    ファセット

    フィルター処理するファセットを選択します。

    フィルター タイトル

    フィルターのタイトルとして表示するテキストを入力します。

    開始日ラベル

    開始日のタイトルとして表示するテキストを入力します。

    終了日ラベル

    終了日のタイトルとして表示するテキストを入力します。

    フィルターの削除のテキスト

    フィルターを削除するボタンのラベルのテキストを入力します。

  3. [フィルター (日付)] ツールバーで、[詳細] をクリックし、[コンポーネント プロパティを編集する] をクリックして、[FilterCriteria] セクションにフィルターの詳細を指定します。

    フィールド

    説明

    開始日の既定のオフセット

    訪問者が選択できる過去の日数を指定します。

    開始日の表示形式

    既定の形式を選択します。

    「開始」日の月を表示

    開始日のカレンダーコントロール ドロップダウン メニューに月と年を表示する場合に選択します。

    過去の日を許可 [共有]

    訪問者が過去の日を選択できるようにする場合に選択します。

    「開始」日付コントロールを表示 [共有]

    訪問者が開始日の範囲を選択できるようにする場合に選択します。

    終了日の既定のオフセット

    訪問者が選択できる将来の日数を指定します。

    終了日の表示形式

    終了日コントロールの日付形式を指定します。

    「終了」日の月を表示

    終了日のカレンダーコントロール ドロップダウンメニューに月と年を表示する場合に選択します。

    将来の日を許可する

    訪問者が将来の日を選択できるようにする場合に選択します。

    「終了」日コントロールを表示

    訪問者が終了日の範囲を選択できるようにする場合に選択します。

フィルター (ドロップダウン) コンポーネントの追加

フィルター (ドロップダウン) フィルターは、選択したファセットでタグ付けされたアイテムに基づいて検索結果をフィルター処理します。

フィルター (ドロップダウン) コンポーネントを追加するには、次の手順に従います。

  1. ツールボックスからページにフィルターをドラッグし、[フィルター (ドロップダウン)] ツールバーで歯車をクリックして、フィルター処理するファセットを設定します。

  2. 次のフィールドを編集できます。

    フィールド

    説明

    ファセット

    フィルター処理するファセットを選択します。

    フィルター タイトル

    フィルターのタイトルとして表示するテキストを入力します。

    空の値のテキスト

    名前のないファセットに表示されるテキストを入力します。

    選択されていないテキスト

    最初の (空) ドロップダウン オプションに表示するテキストを入力するか、空白のままにすることができます。

    フィルターの削除のテキスト

    フィルターを削除するボタンのラベルのテキストを入力します。

  3. [フィルター (ドロップダウン)] ツールバーで、[詳細] をクリックし、[コンポーネント プロパティを編集する] をクリックして、[FilterCriteria] セクションにフィルターの並べ替え順序を指定します。

フィルター (管理範囲) コンポーネントの追加

フィルター (管理範囲) コンポーネントは、ユーザーが価格帯に基づいて製品をフィルター処理できるようにする場合などに、最小値と最大値で結果を指定します。

価格でフィルター処理する管理範囲フィルターの例

フィルター (管理範囲) コンポーネントを追加するには、次の手順に従います。

  1. ツールボックスからページにフィルターをドラッグし、[フィルター (管理範囲)] ツールバーで歯車をクリックして、フィルター処理するファセットを設定します。

  2. 次のフィールドを編集できます。

    フィールド

    説明

    ファセット

    フィルター処理するファセットを選択します。

    フィルター タイトル

    フィルターのタイトルとして表示するテキストを入力します。

    ボタンのラベル

    フィルターをトリガーするボタンのラベルのテキストを入力します。

    開始ラベル

    開始日のタイトルとして表示するテキストを入力します。

    終了ラベル

    終了日のタイトルとして表示するテキストを入力します。

    フィルターの削除のテキスト

    フィルターを削除するボタンのラベルのテキストを入力します。

  3. [フィルター (ドロップダウン)] ツールバーで、[詳細] をクリックし、[コンポーネント プロパティを編集する] をクリックして、[FilterCriteria] セクションにフィルターの並べ替え順序を指定します。

    フィルター

    説明

    選択した最小値

    最小値の範囲を決定します。

    選択した最大値

    最大値の範囲を指定します。

    範囲

    次のいずれかの範囲を選択します。

    • [手動範囲と管理範囲を表示] - 定義済みの名前付き範囲テキスト ボックスと、手動範囲テキスト ボックスの両方を表示します。

    • [手動範囲を表示] - 訪問者が範囲を手動で入力できる 2 つのテキスト ボックスを表示します。

    • [管理範囲を表示] - ラジオ ボタンまたはチェック ボックス付きの定義済み範囲を表示します。

    管理範囲モード

    管理範囲の複数選択を有効にする場合に選択します。

フィルター (半径) コンポーネントの追加

フィルター (半径) コンポーネントは、現在のユーザーの場所からの距離、または場所フィルター レンダリングで提供される場所に基づいて、検索結果をフィルター処理します。

フィルター (半径) コンポーネントを追加するには、次の手順に従います。

  1. コンテンツ エディターで、sitecore/content/<Tenant>/<Site>/Data/Search にナビゲートし、[半径] を右クリックして [挿入] をクリックし、[半径設定] クリックして [OK] をクリックします。

  2. 作成した半径設定を右クリックし、[挿入] をクリックして [半径値] をクリックします。

  3. 新しい半径値をクリックし、[一般] セクションで、次のフィールドに値を追加します。

    • [タイトル] - タイトルを入力します。このフィールドは空であってはなりません (空の場合は表示されません)。

    • [値] - 数値を入力します。このフィールドを空のままにすると、検索は絞り込まれません。

フィルター (範囲スライダー) コンポーネントの追加

フィルター (範囲スライダー) コンポーネントは、訪問者が選択した値よりも少ない、多い、または等しいファセットに基づいて検索結果をフィルター処理します。

フィルター (範囲スライダー) コンポーネントを追加するには、次の手順に従います。

  1. ツールボックスからページにフィルターをドラッグし、[フィルター (範囲スライダー)] ツールバーで歯車をクリックして、フィルター処理するファセットを設定します。

    歯車をクリックして、範囲スライダーの設定を変更します

  2. 次のフィールドを編集できます。

    フィールド

    説明

    ファセット

    フィルター処理するファセットを選択します。

    選択した値の形式 文字列

    文字列形式の値を入力します。例を以下に示します。

    RequestResponse
    {from}-{to} カロリーのフルーツ
    スライダーの値を表示する文字列形式の値の例

    フィルター タイトル:

    フィルターのタイトルとして表示するテキストを入力します。

    変更ステップ

    スライダーのステップの細かい設定を指定します。

    選択した最大値

    範囲の最大値を指定します。

    選択した最小値

    範囲の最小値を指定します。

    最大範囲値

    選択可能な最大値を指定します。

    最小範囲値

    選択可能な最小値を指定します。

    フィルターの削除のテキスト

    フィルターを削除するボタンのラベルのテキストを入力します。

フィルター (スライダー) コンポーネントの追加

フィルター (スライダー) コンポーネントは、選択した範囲内の特定のファセットに基づいて検索結果をフィルター処理します。

フィルター (スライダー) コンポーネントを追加するには、次の手順に従います。

  1. ツールボックスからページにフィルターをドラッグし、[フィルター (スライダー)] ツールバーで歯車をクリックして、フィルター処理するファセットを設定します。

  2. 次のフィールドを編集できます。

    フィールド

    説明

    ファセット

    フィルター処理するファセットを選択します。

    選択した値の形式 文字列

    文字列形式の値を入力します。

    フィルター タイトル

    フィルターのタイトルとして表示するテキストを入力します。

    最小値

    最小値を指定します。

    最大値

    最大値を指定します。

    選択した値

    開始時にスライダーが配置される値を指定します。

    変更ステップ

    スライダーのステップの細かい設定を指定します。

    フィルターの削除のテキスト

    フィルターを削除するボタンのラベルのテキストを入力します。

  3. [フィルター (スライダー)] ツールバーで、[詳細] をクリックし、[コンポーネント プロパティを編集する] をクリックして、[FilterCriteria] セクションで範囲と関係を指定します。

    フィールド

    説明

    範囲インジケーターを表示

    開始値と終了値を表示する場合に選択します。

    関係

    スライダーの動作を示すオプションを指定します。オプションには、固定値、未満、以下、より多い、または以上があります。例には、フィルターで 2 ユーロより安いフルーツをすべて検索する場合が挙げられます。

何かフィードバックはありますか?

この記事を改善するための提案がある場合は、