を使用した成功の設定 Live Search
Adobe Commerce Live Search および Catalog Service 共同で作業して、パフォーマンスが高く関連性が高く直感的な検索ソリューションを提供することで、顧客が必要なものを正確かつ迅速に見つけられるようにします。 具体的には、 Catalog Service などの SaaS サービスのカタログデータを表示します Live Search を使用します。
この記事では、を実装する手順を説明します Live Search (を使用) Catalog Service.
オーディエンス
この記事は、Adobe Commerce インスタンスのインストールと設定を担当するデベロッパーまたはシステムインテグレーターを対象としています。
要件
- Adobe Commerce 2.4.4 以降
- PHP 8.1 / 8.2 / 8.3
- Composer
サポートされるプラットフォーム
- クラウド上のAdobe Commerce(ECE) :2.4.4 以降
- Adobe Commerce オンプレミス(EE) :2.4.4 以降
ワークフローの概要
大まかなレベルでのオンボーディング Live Search では、次の操作が必要です。
1.をインストールする Live Search 拡張子
Live Search は、から拡張機能としてインストールされます。 Adobe Marketplace から コンポーザー. インストールおよび設定後 Live Search、Adobe Commerce 検索およびカタログ データの SaaS サービスとの共有を開始します。 この時点で、 Admin ユーザーは、検索ファセット、同義語およびマーチャンダイジングルールを設定、カスタマイズおよび管理できます。
-
を確認します。 cron ジョブ および インデクサー 実行中です。
note important IMPORTANT 2023 年 8 月のElasticsearch 7 のサポート終了のお知らせに伴い、Adobe Commerceのお客様はすべて OpenSearch 2.x 検索エンジンに移行することをお勧めします。 製品のアップグレード中に検索エンジンを移行する方法については、を参照してください。 OpenSearch への移行 が含まれる アップグレードガイド. -
をダウンロード
live-search
パッケージを Adobe Marketplace. -
コマンドラインから次を実行します。
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 サービスは、カタログデータを同期し、バックグラウンドで製品のインデックスを作成します。
-
次を実行します。
code language-bash bin/magento setup:upgrade
-
次のことを確認します インデクサー は「スケジュールに従って更新」に設定されています。
- 製品フィード
- 製品バリアントフィード
- カタログ属性フィード
- 製品価格フィード
- Scopes Web サイトデータフィード
- 範囲顧客グループデータフィード
- カテゴリフィード
- カテゴリ権限フィード
-
をインストールする場合 Live Search 新しいCommerce インスタンスでは、これで完了です。次にスキップできます 2. API キーの設定 セクション。 Live Search を既存のCommerce インスタンスにインストールする場合は、次の手順に進んでください。
-
次のコマンドを実行して、 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 サービスへの初期同期が開始されます。
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 以降では、製品一覧ウィジェットを手動で有効にする必要があります。
-
から Admin に移動します。 Stores > Settings>Configuration.
-
次の下 Live Search を選択 Storefront Features.
-
を設定 Enable Product Listing Widgets 対象:
Yes
.
この設定を変更すると、メッセージ Page cache is invalidated
表示されます。 変更内容を保存するには、Magentoキャッシュをフラッシュする必要があります。
-
へのアクセス キャッシュ管理 次のいずれかの操作を行ってページを作成します。
- 「」をクリックします Cache Management ワークスペースの上にあるメッセージ内のリンク。
- 日 Admin サイドバー、に移動 System > Tools>Cache Management.
-
「」を選択します 設定 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
ファイルの内容は次のとおりです。
-
現在インストールされているかどうか
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
-
ルートを開きます
composer.json
ファイルでの検索magento/live-search
. -
が含まれる
require
セクションで、次のようにバージョン番号を更新します。code language-json "require": { ... "magento/live-search": "^4.0", ... }
-
保存
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
module-live-search-adapter
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 ウィジェットは次の言語をサポートしています。
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 の一部の並べ替えが正しく機能しない場合があります。 パフォーマンスの違いもあります。
使用目的 Live Search PWA Studioを伴う場合、インテグレーターは次の点にも留意する必要があります。
-
インストール livesearch-storefront-utils.
-
を
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: "$", }, };
の Cookie
Live Search は、基本機能の一部としてユーザーインタラクションデータを収集し、このデータを保存するために cookie が使用されます。 ユーザー情報を収集する場合、ユーザーは Cookie の保存に同意する必要があります。 Live Search および Product Recommendations データストリームを共有するので、cookie メカニズムは同じです。 詳しくは、こちらを参照してください。 Cookie 制限の処理.