商店選取器模組
本文介紹商店選擇器模組，並介紹如何將其添加到網站頁面 Microsoft Dynamics 365 Commerce。
在線購買后，客戶可以使用商店選擇器模組在所選商店中取貨。 在 Commerce 版本 10.0.13 中，商店選擇器模組還包括其他功能，這些功能可以展示顯示附近商店的 “查找商店 ”頁面。
商店選擇器模組允許使用者輸入位置 (城市、州、位址等) 以搜索搜索半徑內的商店。 首次打開模組時，它會使用客戶的瀏覽器位置來查找商店 (如果提供同意)。
商店選擇器模組使用方式
- 可以在產品詳細資訊頁面 (PDP) 上使用商店選擇器模組來選擇要取貨的商店。
- 可以在購物車頁面上使用商店選擇器模組來選擇要取貨的商店。
- 商店選擇器模組可以在顯示所有可用商店的獨立頁面上使用。
在 Commerce headquarters 中履行組設定
要使商店選擇器顯示可用商店，必須在 Commerce headquarters 中設置履行組。 有關詳細資訊，請參閱 設置履行組。
此外，對於履行組中的每個商店，必須在總部中定義商店位置的緯度和經度。
若要在 Commerce headquarters 中輸入商店位置的緯度和經度值，跟隨執行以下步驟。
轉至 庫存管理 > 設置 > 庫存明細。
在左窗格中選擇倉庫位置。
在位址 快速選項卡上，選擇 高級。
在動作窗格上，選取編輯。
在常規 快速選項卡上，輸入緯度 和 經度的值。
在動作窗格上，選擇儲存。
在商店選擇器模組中隱藏商店
履行組中的某些商店可能不是有效的取貨地點。 要確保只有有效的取貨位置顯示為商店選擇器模組中的選項，請在 Commerce headquarters 中跟隨以下步驟。
- 轉到 Retail 和 Commerce > Commerce 設置 > 履行組 > 所有商店。
- 在動作窗格上，選取編輯。
- 在“設置” 下，對於不是有效取貨位置的每個商店，清除“ 是取貨位置 ”複選框。
- 在動作窗格上，選擇儲存。
- 運行 1070 管道配置 分配計劃作業。
必應地圖集成
商店選擇器模組與 必應地圖 REST 應用程式程式設計介面（API） 集成，以使用必應的地理編碼和自動建議功能。 必應地圖 API 金鑰是必需的，並且必須將其添加到 Commerce headquarters 中的共用參數頁面。 地理編碼 API 用於將位置轉換為緯度和經度值。 與自動建議 API 的整合用於在使用者在搜索欄位中輸入位置時顯示搜尋建議。
對於自動建議 REST API，必須確保根據網站的內容安全性原則 (CSP) 允許以下 URL。 此設置在 Commerce 網站建立器中完成，方法是將允許的 URL 添加到網站的各種 CSP 指令 (例如 img-src)。 有關詳細資訊，請參閱 內容安全性原則。
- 對於 connect-src 指令，add *.bing.com。
- 對於 img-src 指令，請添加 *.virtualearth.net。
- 在 script-src 指令中， 添加 *.bing.com、*.virtualearth.net。
- 對於腳本樣式 -src 指令，add *.bing.com。
在商店模式下取貨
商店選擇器模組支援 在商店 提貨模式，該模式顯示產品可供提貨的商店清單。 它還顯示清單中每個商店的商店上班時間和產品庫存。 商店選擇器模組需要產品的上下文來呈現產品可用性，並允許使用者將產品添加到購物車 (如果產品的交貨方式設置為 在所選商店取貨 )。 有關更多資訊，請參閱 庫存設置。
可以將商店選擇器模組添加到 PDP 上的購買方塊模組中，以顯示可供提貨的商店。 它也可以添加到購物車模組中。 在這種情況下，商店選擇器模組會顯示購物車中每個行項的取貨選項。 商店選擇器模組也可以通過擴展和自定義添加到其他頁面或模組。
要使此方案正常工作，應配置產品，以便 使用提貨 交貨方式。 否則，該模組將不會顯示在產品頁面上。 有關如何配置交貨方式的詳細資訊，請參閱 設置交貨方式。
下圖顯示了在 PDP 上使用的商店選擇器模組的範例。
附註
在版本 10.0.16 及更高版本中，可以啟用一項新功能，該功能允許組織為客戶定義多種提貨交貨方式選項。 如果啟用此功能，電子商務的商店選擇器和其他模組將得到增強，以允許購物者從可能的多個取貨交貨選項 (如果已配置) 中進行選擇。 要瞭解有關此功能的更多資訊，請參閱 此文件。
尋找商店模式
商店選擇器模組還支援 查找商店 模式。 此模式可用於創建顯示可用商店及其資訊的商店位置頁面。 在此模式下，商店選擇器模組在沒有產品上下文的情況下工作，可以用作任何網站頁面上的獨立模組。 此外，如果為模組打開了相關設置，用戶可以選擇一個商店作為他們的首選商店。 當選擇商店作為使用者的首選商店時，商店 ID 將保留在瀏覽器 Cookie 中。 因此，用戶必須接受 Cookie 同意消息。
下圖顯示了與商店位置頁面上的地圖模組一起使用的商店選擇器模組的範例。
渲染地圖
商店選擇器模組可以與地圖模組一起使用，以在地圖上顯示商店位置。 有關地圖模組的詳細資訊，請參閱 地圖模組
商店選取器模組屬性
| 屬性名稱 | 值 | 描述 |
|---|---|---|
| 標題 | 文字 | 模組的標題。 |
| 模式 | 尋找商店 或 店內取貨 | 查找商店 模式顯示可用的商店。 在商店 中取貨模式允許使用者選擇要取貨的商店。 |
| 樣式 | 對話方塊 或 內聯 | 模組可以內聯呈現，也可以在對話框中呈現。 |
| 設為慣用商店 | 對 或 錯 | 當此屬性設置為 True 時，使用者可以設置首選存儲。 此功能要求使用者接受 Cookie 同意消息。 |
| 顯示所有商店 | 對 或 錯 | 當此屬性設置為 True 時，使用者可以繞過搜索 半徑 屬性並查看所有應用商店。 |
| 自動建議選項：最大結果數 | 號碼 | 此屬性定義可通過必應自動建議 API 顯示的自動建議結果的最大數量。 |
| 搜尋半徑 | 號碼 | 此屬性定義商店的搜索半徑 (以英里為單位)。 如果未指定任何值，則使用預設搜索半徑 50 英里。 |
| 服務條款 | URL | 此屬性指定使用 Bing 地圖服務所需的服務條款 URL。 |
網站設定
商店選擇器模組遵循將 產品添加到購物車設置。 將商品從商店選擇器模組添加到購物車后，網站使用者將看到相應配置的工作流。
將商店選擇器模組新增到頁面
對於 商店 模式下取貨，該模組只能在 PDP 和購物車頁面上使用。 您必須在模組的屬性表單中將模式 設置為店 內取貨。
若要將商店選擇器模組配置為顯示商店位置頁面的可用商店 (如本文前面的插圖所示)，跟隨執行以下步驟。
- 轉到 “範本”，然後選擇“ 新建 ”以創建新範本。
- 在“新建範本 ” 對話框中的“範本名稱 ”下，輸入 “市場行銷範本”，然後選擇“ 確定”。
- 選擇 保存，選擇 完成編輯 以簽入範本，然後選擇 發佈 以發佈它。
- 轉到 「頁面」，然後選擇「 新建 」以創建新頁面。
- 在“創建新頁面” 對話框中的“頁面名稱 ”下 ，輸入“商店位置 ”，然後選擇“下一步 ”。
- 在選擇範本下 ，選擇您創建的市場行銷範本 ，然後選擇 下一步 。
- 在 “選擇配置”下，選擇頁面配置 (例如“ 靈活配置”)，然後選擇“ 下一步”。
- 在「查看並完成 」下，查看頁面配置。 如果需要編輯頁面資訊，請選擇“ 返回”。 如果頁面資訊正確，請選擇「 創建頁面」。
- 在新頁面的主 插槽中，選擇省略號 (...)，然後選擇添加 模組。
- 在“選擇模組 ” 對話框中，選擇 “容器 ”模組，然後選擇“ 確定”。
- 在容器 插槽中，選擇省略號 (...)，然後選擇 添加模組。
- 在“選擇模組 ” 對話框中，選擇“ 包含 2 列 的容器”模組，然後選擇“ 確定”。
- 在模組的屬性窗格中，將“寬度 ”值設置為 “填充容器”。
- 將 X-Small 視口列配置 值設置為 100%。
- 將 小視口列配置 值設置為 100%。
- 將 「中等」檢視埠列配置 值設置為 33% 67%。
- 將 大視口列配置 值設置為 33%，67%。
- 在“包含 2 列 的容器”插槽中，選擇省略號 (...)，然後選擇“ 添加模組”。
- 在“選擇模組 ” 對話框中，選擇“ 應用商店選擇器 ”模組，然後選擇“ 確定”。
- 在模組的屬性窗格中，將“ 模式 ”值設置為“ 查找存儲”。
- 設置搜索半徑 值 (以英里為單位)。
- 根據需要設置其他屬性，例如設置為 首選商店、 顯示所有商店和 啟用自動建議。
- 在“包含 2 列 的容器”插槽中，選擇省略號 (...)，然後選擇“ 添加模組”。
- 在“選擇模組 ” 對話框中，選擇“ 映射 ”模組，然後選擇“ 確定”。
- 在模組的屬性窗格中，根據需要設置任何其他屬性。
- 選擇 保存，選擇 完成編輯 以簽入頁面，然後選擇 發佈 以發佈頁面。