店舗検索による店頭販売の促進を参照してください。

Retail React アプリテンプレートを使用すると、実装時間を短縮して、Progressive Web App (PWA) Kitサイトに店舗検索を含めることができます。買い物客は、郵便番号や市区町村などに基づいて世界中の店舗の場所を検索できます。Business Manager で店舗情報を簡単に拡張して、サイトに表示される位置情報のメタデータをカスタマイズできます。

このガイドでは、店舗検索の構成方法と使用方法について説明します。

前提条件

店舗検索を含めるには:

以下を使用してサイトを構築します。
- Retail React アプリテンプレート
- Retail React App バージョン 4.0 以降
- Commerce SDK React バージョン 2.0.1 以降
範囲がsfcc.shopper-storesの買い物客ログインおよび API アクセス (SLAS)クライアントを使用します。「買い物客 API の承認」のステップに従うか、registerClient API エンドポイントを使用して、SLAS パブリッククライアントまたはプライベートクライアントを作成または更新します。
- 範囲フィールドに、範囲sfcc.shopper-storesを含めます。
SLAS プライベートクライアントには、パブリッククライアントに比べていくつかの利点があります。SLAS プライベートクライアントの使用を参照してください。

店舗検索の構成

Business Manager で、
- サイトで買い物客に検索してもらいたい国を追加します。B2C Commerce での位置情報データの保存
- サイトで買い物客に検索してもらいたい店舗を追加します。すでに追加した店舗情報を編集できます。また、店舗を一括インポートすることもできます。B2C Commerce での店舗の作成
範囲 app/constants.js
- STORE_LOCATOR_IS_ENABLED定数をtrueに設定します。
- SUPPORTED_STORE_LOCATOR_COUNTRIES定数で、買い物客に表示する国のリストを国ドロップダウンに追加します。
  
  追加する国コードは、Business Manager で追加した店舗の国コードと一致する必要があります。
  
  SUPPORTED_STORE_LOCATOR_COUNTRIES定数が空の場合、買い物客が店舗を検索すると、店舗検索では買い物客が入力した郵便番号が使用されます。店舗検索は、app/constants.jsで定義されたDEFAULT_STORE_LOCATOR_COUNTRY定数で指定された国で検索します。

初期店舗検索レンダリング

デバイスで位置情報の共有をすでに有効にしている買い物客の場合、店舗検索には買い物客のデバイスの GPS 位置に関する結果が表示されます。

デバイスで位置情報の共有が有効になっていない買い物客の場合、店舗ロケーターの初期レンダリングでは、app/constants.jsのこれらの定数で指定されているデフォルトの位置情報の結果が表示されます。

DEFAULT_STORE_LOCATOR_POSTAL_CODE
DEFAULT_STORE_LOCATOR_COUNTRY

制約

店舗検索

一度に最大 200 店舗を返品
最大半径 100 キロメートル以内の店舗を検索します

デフォルトの単位はkm (キロメートル) で、app/constants.jsのSTORE_LOCATOR_DISTANCE_UNIT定数で指定されています。オプションで、単位にマイルを使用するには、STORE_LOCATOR_DISTANCE_UNITをmiに設定します。

デフォルトの最大半径は 100 で、app/constants.jsのSTORE_LOCATOR_DISTANCE定数で指定されています。必要に応じて、STORE_LOCATOR_DISTANCEを選択した最大半径に設定できます。

店舗検索のトラブルシューティング

このセクションでは、店舗検索の使用中に発生する可能性のある一般的なエラーに対して推奨される解決策を示します。

不正確な位置データ

考えられる原因: Business Manager の位置データが不正確です。

**推奨される解決策:**店舗の所在地情報が正確であり、住所、電話番号、営業時間、その他の店舗データの変更が反映されていることを確認します。B2C Commerce での店舗の管理