を使用した成功の設定 Live Search

Adobe Commerce Live Search および Catalog Service 共同で作業して、パフォーマンスが高く関連性が高く直感的な検索ソリューションを提供することで、顧客が必要なものを正確かつ迅速に見つけられるようにします。 具体的には、 Catalog Service などの SaaS サービスのカタログデータを表示します Live Search を使用します。

この記事では、を実装する手順を説明します Live Search (を使用) Catalog Service.

IMPORTANT
サイト検索に関しては、Adobe Commerceのオプションが用意されています。 必ずお読みください。 境界と制限 実装する前に、以下を確認します Live Search は、お客様のビジネスニーズに合っています。

オーディエンス

この記事は、Adobe Commerce インスタンスのインストールと設定を担当するデベロッパーまたはシステムインテグレーターを対象としています。

要件

サポートされるプラットフォーム

  • クラウド上のAdobe Commerce(ECE) :2.4.4 以降
  • Adobe Commerce オンプレミス(EE) :2.4.4 以降

ワークフローの概要

大まかなレベルでのオンボーディング Live Search では、次の操作が必要です。

Live Search ワークフロー

1.をインストールする Live Search 拡張子

Live Search は、から拡張機能としてインストールされます。 Adobe Marketplace から コンポーザー. インストールおよび設定後 Live Search、Adobe Commerce 検索およびカタログ データの SaaS サービスとの共有を開始します。 この時点で、 Admin ユーザーは、検索ファセット、同義語およびマーチャンダイジングルールを設定、カスタマイズおよび管理できます。

NOTE
現在 Live Search 3.0.2、 Catalog Service 拡張機能は、にバンドルされています Live Search インストール。
  1. を確認します。 cron ジョブ および インデクサー 実行中です。

    note important
    IMPORTANT
    2023 年 8 月のElasticsearch 7 のサポート終了のお知らせに伴い、Adobe Commerceのお客様はすべて OpenSearch 2.x 検索エンジンに移行することをお勧めします。 製品のアップグレード中に検索エンジンを移行する方法については、を参照してください。 OpenSearch への移行 が含まれる アップグレードガイド.
  2. をダウンロード live-search パッケージを Adobe Marketplace.

  3. コマンドラインから次を実行します。

    code language-bash
    composer require magento/live-search
    

    を追加する場合 Live Search への拡張 新規 Adobe Commerceのインストール。以下を実行して無効にします OpenSearch および関連モジュールとインストール Live Search. 次に、手順 4 に進みます。

    code language-bash
       bin/magento module:disable Magento_Elasticsearch Magento_Elasticsearch7 Magento_OpenSearch Magento_ElasticsearchCatalogPermissions Magento_InventoryElasticsearch Magento_ElasticsearchCatalogPermissionsGraphQl
    

    を追加する場合 Live Search の拡張 既存 Adobe Commerceのインストール。次のコマンドを実行して、一時的に Live Search ストアフロントの検索結果を提供するモジュール。 次に、手順 4 に進みます。

    code language-bash
       bin/magento module:disable Magento_LiveSearchAdapter Magento_LiveSearchStorefrontPopover Magento_LiveSearchProductListing
    

    Elasticsearch は、が次の期間、ストアフロントからの検索リクエストを引き続き管理します Live Search サービスは、カタログデータを同期し、バックグラウンドで製品のインデックスを作成します。

  4. 次を実行します。

    code language-bash
    bin/magento setup:upgrade
    
  5. 次のことを確認します インデクサー は「スケジュールに従って更新」に設定されています。

    • 製品フィード
    • 製品バリアントフィード
    • カタログ属性フィード
    • 製品価格フィード
    • Scopes Web サイトデータフィード
    • 範囲顧客グループデータフィード
    • カテゴリフィード
    • カテゴリ権限フィード
  6. をインストールする場合 Live Search 新しいCommerce インスタンスでは、これで完了です。次にスキップできます 2. API キーの設定 セクション。 Live Search を既存のCommerce インスタンスにインストールする場合は、次の手順に進んでください。

  7. 次のコマンドを実行して、 Live Search 拡張機能、無効化 OpenSearch、および実行 setup.

    code language-bash
    bin/magento module:enable Magento_LiveSearchAdapter Magento_LiveSearchStorefrontPopover  Magento_LiveSearchProductListing
    
    code language-bash
    bin/magento module:disable Magento_Elasticsearch Magento_Elasticsearch6 Magento_Elasticsearch7 Magento_ElasticsearchCatalogPermissions Magento_InventoryElasticsearch
    Magento_ElasticsearchCatalogPermissionsGraphQl
    
    code language-bash
    bin/magento setup:upgrade
    

2. API キーの設定

接続するには、Adobe Commerce API キーとそれに関連する秘密鍵が必要です Live Search からAdobe Commerceのインストールに移動します。 API キーが生成され、のアカウントで管理されます Commerce 開発者またはシステムインテグレーターとライセンスを共有できるライセンス所有者。 その後、開発者は、ライセンス所有者に代わって SaaS データスペースを作成および管理できます。 既に一連の API キーがある場合は、それらを再生成する必要はありません。

で API キーを設定する方法を説明します Commerce サービスコネクタ 記事。

3. カタログデータを同期する synchronize-catalog-data

Live Search カタログ データをAdobeの SaaS インフラストラクチャに移動します。 データにインデックスが作成され、検索結果はこのインデックスからストアフロントに直接配信されます。 サイズと複雑さに応じて、インデックス作成に 30 分から数時間かかる場合があります。

カタログ データを SaaS サービスに初期同期するには、次のコマンドをこの順序で実行します。

bin/magento saas:resync --feed productattributes
bin/magento saas:resync --feed products
bin/magento saas:resync --feed scopesCustomerGroup
bin/magento saas:resync --feed scopesWebsite
bin/magento saas:resync --feed prices
bin/magento saas:resync --feed productoverrides
bin/magento saas:resync --feed variants
bin/magento saas:resync --feed categories
bin/magento saas:resync --feed categoryPermissions

これらのコマンドを実行すると、カタログ データの SaaS サービスへの初期同期が開始されます。

WARNING
データのインデックスが作成され同期されている間は、ストアフロントで検索およびカテゴリの参照操作を使用できません。 カタログのサイズによっては、このプロセスは時間から少なくとも 1 時間かかる場合があります cron を実行して、データを SaaS サービスに同期します。

同期の進行状況の監視

同期および共有されているデータは、 データ管理ダッシュボード. このダッシュボードは、ストアフロントの製品データの可用性に関する貴重なインサイトを提供し、買い物客に迅速に表示できるようにします。

データ管理ダッシュボード

今後の製品アップデート

初回同期後、製品の増分更新がストアフロント検索で使用できるようになるまで最大 15 分かかる場合があります。 詳しくは、 インデックス作成 – ストリーミング製品の更新.

4. データが書き出されたことを確認します verify-export

カタログデータがAdobe Commerce インスタンスから書き出され、用に同期されていることを確認するには Live Searchには、次の 2 つのオプションがあります。

  • 次の表のエントリを探します。

    • catalog_data_exporter_products
    • catalog_data_exporter_product_attributes
  • の使用 GraphQL遊び場 デフォルトのクエリを使用して、次の点を確認します。

    • 返される製品数は、ストア表示で期待される数に近くなります。
    • ファセットが返されます。

その他のヘルプについては、を参照してください Live Search カタログが同期されていません サポートナレッジベース

5. データを設定する

製品データを正しく設定すると、顧客に適した検索結果が得られます。 このセクションでは、製品リストウィジェットを有効にし、カテゴリを割り当てます。

製品リストウィジェットの有効化

のインストール時 Live Search 4.0.0 以降、製品一覧表示ウィジェットはデフォルトで有効になっています。 ウィジェットを有効にすると、検索結果ページとカテゴリ参照の製品リストページで別の UI コンポーネントが使用されます。 この UI コンポーネントは、 Catalog Service APIこれにより、応答時間が短縮されます。

次がある場合: Live Search バージョン 4.0.0 以降では、製品一覧ウィジェットを手動で有効にする必要があります。

  1. から Admin ​に移動します。 Stores > Settings>Configuration.

  2. 次の下 Live Search ​を選択 Storefront Features.

  3. を設定 Enable Product Listing Widgets 対象: Yes.

    製品リストウィジェットの有効化

この設定を変更すると、メッセージ Page cache is invalidated 表示されます。 変更内容を保存するには、Magentoキャッシュをフラッシュする必要があります。

  1. へのアクセス キャッシュ管理 次のいずれかの操作を行ってページを作成します。

    • 「」をクリックします Cache Management ワークスペースの上にあるメッセージ内のリンク。
    • Admin サイドバー、に移動 System > Tools>Cache Management.
  2. 「」を選択します 設定 Cache Type をクリックして、 Flush Magento Cache.

    ストアフロントに対する変更は、キャッシュをフラッシュした直後に行われます。

カテゴリの割り当て

返品された商品 Live Search に割り当てなければなりません category. 例えば Luma では、製品が「男性」、「女性」、「歯車」などのカテゴリに分類されます。 サブカテゴリも「トップス」、「ボトムス」、「ウォッチポイント」に設定されます。 これにより、フィルタリング時の精度が向上します。

6.接続をテストする test-connection

カタログデータを SaaS にして、テストを行い、次のシナリオで製品データが返されることを確認します。

  • この Search box は正しく結果を返します
  • カテゴリの参照で結果が正しく返される
  • ファセットは、検索結果ページでフィルターとして使用できます

すべてが正しく動作する場合、 Live Search がインストールされ、接続され、使用できる状態である。

ストアフロントで問題が発生した場合は、 var/log/system.log api 通信エラーまたはサービス側のエラーのファイル。

許可する Live Search ファイアウォールを使用して、次を追加します commerce.adobe.io を許可リストに追加します。

7. ストアフロントに合わせたカスタマイズ

がインストールされました Live Search データの拡張、同期、検証、設定を行います。 次に、以下を確実にします Live Search ウィジェットは、ストアのルックアンドフィールに準拠しています。

ポップオーバーウィジェットと PLP ウィジェットのスタイルを設定するには、必要に応じてカスタム CSS ルールを定義します。 参照: ポップオーバー要素のスタイル設定 および 製品一覧ページウィジェット.

ウィジェットの機能を拡張する場合は、各のソースコードを公開リポジトリで入手できます。
このシナリオでは、独自のニーズに合わせて JavaScript をカスタマイズし、カスタムコードを CDN にホストできます。 このカスタムスクリプトは、 Live Search サービスを実行し、通常と同様の結果を返すことで、ウィジェットの機能を制御できます。

更新中 Live Search update

Live Search を更新する前に、コマンドラインから次のコマンドを実行して、インストールされている Live Search のバージョンを確認します。

composer show magento/module-live-search | grep version

更新対象 Live Searchコマンドラインから次を実行します。

composer update magento/live-search --with-dependencies

3.1.1 から 4.0.0 などのメジャーバージョンに更新するには、プロジェクトのルートを編集します Composer .json ファイルの内容は次のとおりです。

  1. 現在インストールされているかどうか magento/live-search バージョン : 3.1.1 またはの下で、をバージョンにアップグレードしています 4.0.0 またはそれ以降の場合は、アップグレードの前に次のコマンドを実行します。

    code language-bash
    bin/magento module:enable Magento_AdvancedSearch
    

    現在インストールされているに関する情報 magento/live-search バージョンで、次のコマンドを実行します。

    code language-bash
    composer show magento/live-search
    
  2. ルートを開きます composer.json ファイルでの検索 magento/live-search.

  3. が含まれる require セクションで、次のようにバージョン番号を更新します。

    code language-json
    "require": {
       ...
       "magento/live-search": "^4.0",
       ...
     }
    
  4. 保存 composer.json. コマンドラインから次のコマンドを実行します。

    code language-bash
    composer update magento/live-search --with-dependencies
    

アンインストール Live Search uninstall

アンインストールするには Live Searchを参照してください。 モジュールのアンインストール.

Live Search パッケージ packages

この Live Search 拡張機能は、次のパッケージで構成されます。

パッケージ
説明
module-live-search
を使用すると、マーチャントは、ファセット、同義語、クエリルールなどの検索設定を指定したり、読み取り専用のGraphQL プレイグラウンドにアクセスしてクエリをテストしたりできます。 Admin.
module-live-search-adapter
ストアフロントから次の場所に検索リクエストをルーティングします: Live Search 結果をサービスし、ストアフロントでレンダリングします。
- カテゴリの参照 – ストアフロントからリクエストをルーティングします 上部ナビゲーション を検索サービスに追加します。
- グローバル検索 – フォルダーからのリクエストをルーティングします クイック検索 ~の店舗の右上にある箱 Live Search サービス。
module-live-search-storefront-popover
「入力中に検索」ポップオーバーは、標準のクイック検索に代わるもので、上位の検索結果のデータとサムネールを返します。

Live Search dependencies dependencies

次の Live Search 依存関係は次によってキャプチャされます。 Composer.

  • magento/module-saas-catalog
  • magento/module-saas-category
  • magento/module-saas-category-permissions
  • magento/module-saas-product-override
  • magento/module-saas-product-variant
  • magento/module-saas-price
  • magento/module-saas-scopes
  • magento/module-bundle-product-data-exporter
  • magento/module-catalog-inventory-data-exporter
  • magento/module-catalog-url-rewrite-data-exporter
  • magento/module-configurable-product-data-exporter
  • magento/module-parent-product-data-exporter
  • magento/module-gift-card-product-data-exporter
  • magento/module-bundle-product-override-data-exporter
  • data-services
  • services-id

高度な概念

以下のセクションでは、を使用する際の、より詳細なトピックを提供します Live Search および Catalog Service.

エンドポイント

Live Search エンドポイント ()を介した通信 https://catalog-service.adobe.io/graphql.

As Live Search 完全な製品データベースへのアクセス権がない Live Search GraphQLとCommerceのコアGraphQLには、完全な同等機能はありません。

SaaS API (特にカタログサービスエンドポイント)を直接呼び出すことをお勧めします。

  • Commerce データベース/Graphql プロセスをバイパスすることで、パフォーマンスを向上させ、プロセッサー負荷を軽減します。
  • を利用する Catalog Service 通話連合 Live Search, Catalog Service、および Product Recommendations 単一のエンドポイントから。

一部のユースケースでは、を呼び出す方が良い場合もあります。 Catalog Service 製品の詳細および類似の事例について。 参照: refineProduct を参照してください。

カスタムのヘッドレス実装がある場合は、 Live Search リファレンス実装:

Luma の検索アダプターやウィジェット、AEM CIFウィジェットなどのデフォルトのコンポーネントを使用しない場合、イベント(インテリジェントマーチャンダイジングおよびパフォーマンス指標をAdobe Senseiにフィードするクリックストリームデータ)は初期設定では機能せず、ヘッドレスイベントを実装するにはカスタム開発が必要です。

の最新バージョン Live Search はすでに使用しています Catalog Service.

言語サポート

Live Search ウィジェットは次の言語をサポートしています。

言語
地域
言語コード
Magentoーロケール
ブルガリア語
ブルガリア
bg_BG
bg_BG
カタルニア語
スペイン
ca_ES
ca_ES
チェコ語
チェコ共和国
cs_CZ
cs_CZ
デンマーク語
デンマーク
da_DK
da_DK
ドイツ語
ドイツ
de_DE
de_DE
ギリシャ語
ギリシャ
el_GR
el_GR
英語
英国
en_GB
en_GB
英語
米国
en_US
en_US
スペイン語
スペイン
es_ES
es_ES
エストニア語
エストニア
et_EE
et_EE
バスク語
スペイン
eu_ES
eu_ES
ペルシャ語
イラン
fa_IR
fa_IR
フィンランド語
フィンランド
fi_FI
fi_FI
フランス語
フランス
fr_FR
fr_FR
ガリシア語
スペイン
gl_ES
gl_ES
ヒンディー語
インド
hi_IN
hi_IN
ハンガリー語
ハンガリー
hu_HU
hu_HU
インドネシア
インドネシア
id_ID
id_ID
イタリア語
イタリア
it_IT
it_IT
韓国語
韓国
ko_KR
ko_KR
リトアニア語
リトアニア
lt_LT
lt_LT
ラトビアン
ラトビア
lv_LV
lv_LV
ノルウェー語
ノルウェーブークマル
nb_NO
nb_NO
オランダ語
オランダ
nl_NL
nl_NL
ポーランド語
ポーランド
pl_PL
pl_PL
ポルトガル語
ブラジル
pt_BR
pt_BR
ポルトガル語
ポルトガル
pt_PT
pt_PT
ルーマニア語
ルーマニア
ro_RO
ro_RO
ロシア
ロシア
ru_RU
ru_RU
スウェーデン語
スウェーデン
参照(_S)
参照(_S)
タイ語
タイ
th_TH
th_TH
トルコ語
トルコ
tr_TR
tr_TR
中国語
中国
zh_CN
zh_Hans_CN
中国語
台湾
zh_TW
zh_Hant_TW

Commerce Admin 言語設定(ストア > 設定 > 設定 > 一般 /国オプションの場合)はサポートされる言語と一致し、デフォルトでその言語に設定されます。 それ以外の場合、ウィジェットのデフォルト値は英語になります。

管理者は、 検索インデックスを使用して、より良い検索結果が得られるようにします。

ウィジェットコードリポジトリー

製品一覧ページウィジェットとライブ検索フィールドウィジェットは、どちらも github リポジトリからダウンロードできます。

これにより、開発者は機能とスタイル設定を完全にカスタマイズできます。 これらのユーザーは、 Live Search サービス。

Inventory management

Live Search のサポート Inventory management Commerceの機能(以前はマルチソースインベントリ(MSI)と呼ばれていました)。 フルサポートを有効にするには、次の操作を行う必要があります 更新 依存関係モジュール commerce-data-export をバージョン 102.2.0 以降にアップグレードします。

Live Search Inventory management内で商品が使用可能かどうかを示すブール値を返しますが、どのソースに在庫があるかに関する情報は含まれません。

価格インデクサー

Live Search のお客様は新しいを使用できます SaaS 価格インデクサーこれにより、価格変更の更新と同期時間が短縮されます。

価格サポート

ライブ検索ウィジェットは、Adobe Commerceでサポートされているすべての価格タイプではなく、ほとんどの価格タイプをサポートしています。

現在、基本価格がサポートされています。 サポートされていない高度な価格は次のとおりです。

  • コスト
  • 広告の最低価格

を見る API メッシュ より複雑な価格計算の場合。

価格フォーマットでは、Commerce インスタンス内の次のロケール設定がサポートされます。 ストア > 設定 > 設定 > 一般 > 一般 / ローカルオプション / ロケール。

ヘッドレスストアフロントのサポート

オプションで、 module-data-services-graphql アプリケーションの既存のGraphQL範囲を拡張し、ストアフロントの行動データ収集に必要なフィールドを含めるモジュール。

composer require magento/module-data-services-graphql

このモジュールは、GraphQL クエリにコンテキストを追加します。

  • dataServicesStorefrontInstanceContext
  • dataServicesMagentoExtensionContext
  • dataServicesStoreConfigurationContext

B2B サポート

Live Search のサポート B2B 機能 (追加:) 制限事項.

PWAサポート

Live Search はPWA Studioで動作しますが、他のCommerce実装と比較すると、わずかな違いがあります。 検索や製品リストのページなどの基本的な機能は Venia で機能しますが、Graphql の一部の並べ替えが正しく機能しない場合があります。 パフォーマンスの違いもあります。

  • 現在のPWAの実装 Live Search 検索結果を返すのに必要な処理時間は、 Live Search ネイティブのCommerce ストアフロントを使用します。
  • Live Search PWA内のはサポートしていません イベント処理. その結果、検索レポートやインテリジェントマーチャンダイジングも機能します。
  • での直接フィルタリング description, name, short_description と共に使用した場合、はGraphQLでサポートされません PWAただし、より一般的なフィルターで返されます。

使用目的 Live Search PWA Studioを伴う場合、インテグレーターは次の点にも留意する必要があります。

  1. インストール livesearch-storefront-utils.

  2. environmentId が含まれる storeDetails オブジェクト。

    code language-javascript
    const storeDetails: StoreDetailsProps = {
        environmentId: <Storefront_ID>,
        websiteCode: "base",
        storeCode: "main_website_store",
        storeViewCode: "default",
        searchUnitId: searchUnitId,
        config: {
            minQueryLength: 5,
            pageSize: 8,
            currencySymbol: "$",
            },
        };
    

Live Search は、基本機能の一部としてユーザーインタラクションデータを収集し、このデータを保存するために cookie が使用されます。 ユーザー情報を収集する場合、ユーザーは Cookie の保存に同意する必要があります。 Live Search および Product Recommendations データストリームを共有するので、cookie メカニズムは同じです。 詳しくは、こちらを参照してください。 Cookie 制限の処理.

recommendation-more-help
1d60634e-b73a-404a-be7a-4a2a36676055