ページへの Search&Promote 機能の追加

Web サイトに Search&Promote 機能を統合するには、Search&Promote コンポーネントを使用してページに次の機能を追加します。

  • キーワード検索
  • 検索結果のページ
  • 検索の絞り込み
  • バナー

Search&Promote 機能は、AEM の管理者が有効にしている場合にのみ使用できます。Adobe Search&Promote との統合を参照してください。

Search&Promote サーバーでは、ファセットや各コンポーネントが提供する情報が設定されています。次の表で、各コンポーネントの概要について説明します。後続のセクションではそれらの用途の詳細情報を提供します。

Search&Promote のコンポーネント 説明
バナー バナー広告を表示します。バナーは Search&Promote を通じて収集されたデータに基づいて選択されます。
パンくずリスト 検索キーワードとユーザーが検索結果に適用したフィルターの結果が表示されます。
チェックボックスリストファセット 検索結果をフィルタリングするためのファセットを選択するチェックボックスのリスト。
ドロップダウンファセット 検索結果をフィルタリングするためのファセットのドロップダウンリスト。
リンクリストファセット 検索結果をフィルタリングするためのファセットリンクのリスト。
ページネーション 検索結果のページを検索するためのコントロール。
結果 キーワード検索の結果を表示します。
検索 ページに検索フィールドを追加します。

検索結果ページの作成

WCM Web サイトコンソールを使用して、検索結果を表示するページを作成します。同じ Search&Promote サービスを使用している場合、すべての検索コンポーネントからの検索結果をこのページに表示することができます。

ユーザーは結果コンポーネントとページネーションコンポーネントで検索結果をレビューできます。結果​コンポーネントには、編集モードやデザインモードで構成可能なプロパティがありません。結果コンポーネントには検索結果の一覧と、他のページへのリンク、指定の検索キーワードによる検索結果の数が表示されます。

srchresultscomp

ページネーション​コンポーネントでは、複数ページの検索結果を移動できます。ユーザーはページ数を確認し、次のページや前のページに移動したり、ページを選択して開いたり、すべての結果を 1 つのページに表示したりできます。

srchpagination

編集モードで次のコンポーネントプロパティを設定して、実行時の動作を制御できます。

  • 単一の結果ページを非表示にする:検索結果が1ページしか返されない場合に、ページナビゲーションコントロールを非表示にするには、このオプションを選択します。
  • 最初/最後を非表示にする:ユーザーが検索結果の最初のページと最後のページにジャンプできないようにするには、このオプションを選択します。
  • 前へ/次へを非表示にする:ユーザーが現在のページを基準として結果ページを移動できるようにするかどうかを決定します。
  • すべてのビューを非表示にする:ユーザーがすべての検索結果を 1 ページに統合できるようにするかどうかを決定します。通常、ページ分割されたデータを提供するとサーバーのリソースをより効率的に使用できます。サイズの大きなデータセットを 1 つの応答メッセージで転送されないようにするには、このオプションを選択します。

ファセットによる結果のフィルタリングの有効化

ユーザーが検索結果をファセットでフィルタリングできるように設定できます。チェックボックスリストファセットドロップダウンファセットリンクリストファセット​の各コンポーネントを使用して、フィルタリングするファセットを1つ以上選択できます。 これらのコンポーネントを使用する際には、パンくず​コンポーネントも指定することをお勧めします。パンくずは、現在使用されているフィルターを示します。

チェックボックスリストファセットドロップダウンファセットリンクリストファセット​の各コンポーネントには、編集​モードで設定する次のプロパティがあります。

  • ファセット名:フィルターに使用されるファセットの名前。

チェックボックスリストファセット​コンポーネントにファセットのリストと関連するチェックボックスが表示されます。チェックボックスリストファセット​を使用して、ユーザーが複数のファセットからの項目が含まれる結果のサブセットを表示できるようにします。例えば、複数のブランドが同じ種類の製品を供給する場合は、ブランドファセットが適切です。

検索結果に関連付けられている各ファセットにチェックボックスが表示されます。ユーザーがチェックボックスをオンにすると、ページが再度読み込まれ、結果セットが更新されます。すべてのチェックボックスはページに表示されたままなので、ユーザーはいつでもフィルターに対してファセットを追加または削除できます。

sandcheckboxcomp

ドロップダウンファセット​コンポーネントを使用すると、ユーザーがドロップダウンリストからファセット項目を選択できます。このコンポーネントは、一度に 1 つのファセットに絞り込む場合に便利です。例えば、商品検索を性別で絞り込む場合には部門ファセットが適切です。**​ジーンズを探しているジョンが部門を「男性」でフィルター。

ドロップダウンリストには、すべての検索結果に関連付けられているファセットが入力されています。ドロップダウンリストで項目を選択すると、ページが再度読み込まれ、結果セットが更新されます。ドロップダウンリストの項目は変わらないので、ユーザーはいつでもファセットを切り替えることができます。

sanddropdowndepartment

リンクリストファセット​コンポーネントを使用すると、ユーザーが複数のファセットメンバーまたはファセットで項目を段階的に絞り込むことができます。

ファセットメンバーはリンクのリストとして表示されます。各リンクのテキストは、現在の検索結果に関連付けられているファセットメンバーの名前です。ユーザーがファセットリンクをクリックすると、ページが再度読み込まれ、検索結果のサブセットが表示されます。リンクのリストはクリックに応じて更新され、結果をさらに絞り込むことができます。

sandplinklistcomp

また、リンクのリストは、異なる種類の Search&Promote コンポーネントからフィルターが適用されても変わります。複数の種類のフィルターコンポーネントを使用することで、フィルターを効果的に組み合わせることができます。

パンくず​コンポーネントを使用すると、ユーザーが検索結果に現在適用されているフィルターを、適用された順序で確認できます。パンくずの項目をクリックすることで、そのフィルターの組み合わせに戻すことができます。

sandbreadcrumbcomp

編集モードで次のパンくずのプロパティを設定して、コンポーネントの外観をカスタマイズできます。

  • 区切り:各パンくずの区切りとして機能する文字または文字列を定義します。「区切り」フィールドには任意の文字列を入力できます。デフォルトの設定は、">"(引用符なし)です。
  • 末尾の区切り:パンくずの最後に表示する文字または文字列を定義します。「末尾の区切り」フィールドには任意の文字列を入力できます。デフォルトの設定は、blank(パンくず行の最後に何も表示しない)です。

検索ボックスの追加

検索コンポーネントを使用すると、ユーザーがキーワード検索を実行できます。検索機能にアクセス権限を付与する各ページに検索コンポーネントを追加します。

編集モードで次のプロパティを設定し、実行時の動作を制御します。

  • 結果ページのパス:検索結果が表示されるページへのパス。
  • オートコンプリートを有効にする:ユーザーが検索ボックスに入力を開始すると検索キーワードの候補が表示されます。

sandsearchcomp

バナーの追加

Bannersコンポーネントは、顧客のSearch&Promote検索に従ってバナー広告を表示します。 Search&Replace サーバーのロジックにより表示されるバナーが決まります。例えば、「ジーンズ」を検索するとファッション関連のバナーが表示されます。「男性」部門でフィルタリングすると、バナーがさらに絞り込まれます。

バナーコンポーネントは、バナー領域と呼ばれる構成可能な 1 つのプロパティを提供します。編集モードで、プロパティ値の 1 つの選択してバナーの表示方法を指定します。Search&Promote サービスにより、値のリストの選択元が決まります。

Search&Promote 検索ページの例

この図は、下の完全に機能する Search&Promote 結果ページを作成するためにページに追加されるコンポーネントを示します。

1328213789109 sandppageexample

このページ

Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now