共用方式為

設定 B2B 電子商務網站

  • 發行項

企業對企業 (B2B) 電子商務網站提供了一些優化 B2B 使用者工作流程的關鍵功能。 本文介紹如何建立 B2B 電子商務網站 Microsoft Dynamics 365 Commerce。 它詳細介紹了必須配置才能啟用 B2B 特定方案的模組和網站設定。

前提條件

  • 若要設定 B2B 電子商務網站，您必須在 Commerce 總部啟用並配置特定功能，如本文所述。
  • 產品發現、產品詳細資訊頁面、購物車和結帳等核心體驗由用於企業對消費者 (B2C) 電子商務網站的相同模組提供支援。 網站作者應該熟悉 Dynamics 365 Commerce 支援的所有模組。 有關詳細信息，請參閱 模組庫概述。
  • 本文假設網站作者了解商務網站建立器、範本、片段和頁面的基礎知識，以便他們能夠為電子商務網站啟用 B2B 功能。

站點級設定

您可以在網站建立器中的 網站設定 > 擴充功能中存取網站層級設定。 以下兩個站點層級設定適用於 B2B 場景：

  • 啟用客戶帳戶付款 - 此屬性允許使用者使用客戶帳戶支付訂單。 可用值包括 為 B2B 客戶啟用、 為 B2C 客戶啟用、 啟用對於所有客戶，且 對所有客戶停用。 如果您的 B2B 網站支援客戶帳戶，則應選擇 為 B2B 客戶啟用。
  • 啟用訂單數量限制 - 此屬性可讓您設定每個產品或類別可以訂購的商品數量限制。 可用值包括 為 B2B 客戶啟用、 為 B2C 客戶啟用、 啟用對於所有客戶，且 對所有客戶停用。

附註

當您升級到模組庫的最新版本時，您必須執行其他步驟以確保前面描述的網站設定在您的環境中可用。 有關詳細信息，請參閱 更新 app.settings.json 文件。

建立業務合作夥伴註冊頁面

要成為業務合作夥伴，使用者必須先提交業務合作夥伴請求。 B2B 主頁上將提供指向業務合作夥伴請求頁面的鏈接，以便用戶可以啟動該流程。 用戶提交業務合作夥伴請求後，他們將收到請求已提交的確認資訊。

建立業務合作夥伴請求頁面

業務合作夥伴請求頁面上的 合作夥伴註冊 模組用於發起成為業務合作夥伴的使用者請求。 此模組可讓您收集註冊過程所需的使用者資訊。 此外， 企業帳戶位址 模組用於擷取使用者的位址。

若要在網站建構器中設定和設定業務合作夥伴要求頁面，請依照下列步驟操作。

  1. 建立一個名為 Signup 的範本。 此模板應包含以下模組：

    • 合作夥伴註冊
    • 階層連結
    • 頁首
    • 票尾
    • 內容區塊
    • 文字區塊
    • 產品集合

  2. 使用 註冊 範本建立一個名為 業務夥伴請求的頁面。

  3. 在 標頭 插槽中，新增使用站點標頭預先配置的標頭片段。

  4. 在 頁腳 插槽中，新增使用網站頁腳預先設定的頁尾片段。

  5. 在 Main 插槽中，加入 Container 模組。 在模組屬性窗格中，將 寬度 值設定為 填滿容器。

  6. 在 Container 插槽中，新增 Breadcrumb 模組。 在模組屬性窗格中的 連結下，配置指向主頁的鏈接，然後輸入 Home 作為連結文本。

  7. 在 容器 插槽中，在 麵包屑 的下方新增 合作夥伴註冊模組 模組。 在模組屬性窗格中的 標題下，輸入 成為業務夥伴。

  8. 在 合作夥伴註冊 插槽中，新增 企業帳戶位址 模組。

  9. 在 容器 插槽中，在 合作夥伴註冊下方新增 文字區塊 模組 模組。 在這裡，您可以定義註冊過程的一些條款和條件。

  10. 選擇 儲存，然後選擇 預覽 以預覽頁面。

  11. 選擇 儲存，選擇 完成編輯 簽入頁面，然後選擇 發佈 以發布它。

  12. 發布頁面的 URL。

建立業務合作夥伴請求確認頁面

提交業務合作夥伴請求後，應向使用者顯示確認頁面以確認提交。

若要在網站建構器中設定和設定請求確認頁面，請依照下列步驟操作。

  1. 使用您先前建立的 註冊 範本建立一個名為 合作夥伴請求確認的頁面。
  2. 在 標頭 插槽中，新增使用站點標頭預先配置的標頭片段。
  3. 在 頁腳 插槽中，新增使用網站頁腳預先設定的頁尾片段。
  4. 在 Main 插槽中，加入 Container 模組。 在模組屬性窗格中，將 寬度 值設定為 填滿容器。
  5. 在 容器 插槽中，新增 內容區塊 模組。 在模組屬性窗格中的 標題下，輸入 請求已提交。 在 富文本 欄位中，輸入 您的請求已提交。 在 連結下，配置指向主頁的鏈接，然後輸入 返回購物 作為連結文字。
  6. 增加另一個 容器 模組，並向其新增 產品集合 模組。
  7. 使用您想要在頁面上展示的推薦或類別清單配置 產品集合 模組。
  8. 選擇 儲存，然後選擇 預覽 以預覽頁面。
  9. 選擇 儲存，選擇 完成編輯 簽入頁面，然後選擇 發佈 以發布它。
  10. 發布頁面的 URL。

要在網站建立器中新增指向請求確認頁面的鏈接，請按照以下步驟操作。

  1. 前往您先前建立的 業務夥伴請求 頁面，然後選擇 編輯。
  2. 選擇 合作夥伴註冊 模組插槽。 在屬性窗格中的 指向註冊確認頁面的連結下，設定指向您先前建立的業務合作夥伴請求頁面的連結。
  3. 選擇 儲存，選擇 完成編輯 簽入頁面，然後選擇 發佈 以發布它。

將業務合作夥伴請求連結新增至主頁

建立業務合作夥伴要求註冊和確認頁面後，您必須透過主頁上的連結存取註冊頁面。 您可以透過新增指向主頁上任何 內容區塊 模組的連結來完成此任務。

若要將業務合作夥伴請求連結新增至網站建立器的主頁，請依照下列步驟操作。

  1. 前往您網站的主頁，然後選擇 編輯。
  2. 選擇 內容區塊 模組插槽。 在模組屬性窗格中的 鏈接下，配置指向您之前創建的業務合作夥伴請求頁面的鏈接，然後輸入 註冊成為業務合作夥伴 或與連結文字類似的文字。 根據需要添加圖像。
  3. 選擇 儲存，選擇 完成編輯 簽入頁面，然後選擇 發佈 以發布它。

帳號管理登陸頁面

帳戶管理登陸頁麵包括 B2B 和 B2C 電子商務網站所需的所有帳戶管理資訊。 只有登入使用者才能查看此頁面。

若要在網站建立器中建立和設定 B2B 帳戶管理登入頁面，請依照下列步驟操作。

  1. 建立一個名為 帳戶管理的範本。 此模板應包含以下模組：

    • 頁首
    • 票尾
    • 階層連結
    • 帳戶歡迎圖標
    • 帳戶通用圖標
    • 帳戶地址圖塊
    • 帳戶願望清單圖標
    • 帳戶地址圖標
    • 帳戶會員圖標
    • 帳戶客戶餘額圖標
    • 帳戶訂單範本圖標
    • 組織使用者
    • 商業組織清單
    • 客戶帳戶餘額
    • 訂單範本明細
    • 訂單範本清單
    • 帳戶發票圖標
    • 發票清單
    • 發票詳細資料

  2. 使用 帳戶管理 範本建立一個名為 我的帳戶的頁面。

  3. 在 標頭 插槽中，新增使用站點標頭預先配置的標頭片段。

  4. 在 頁腳 插槽中，新增使用網站頁腳預先設定的頁尾片段。

  5. 在 Main 插槽中，加入 Container 模組。 在模組屬性窗格中，將 寬度 值設定為 填滿容器。

  6. 在 Container 插槽中，新增 Breadcrumb 模組。 在模組屬性窗格中的 連結下，配置指向主頁的鏈接，然後輸入 Home 作為連結文本。

  7. 在 容器 插槽中，新增 歡迎磁貼 模組。 在模組屬性窗格中的 標題下，輸入 Welcome。

  8. 在 Main 插槽中，再增加一個 Container 模組（Container 2）。 在模組屬性窗格中，將 寬度 值設定為 填滿容器。 將 顯示的子項 值設為 兩個。

  9. 在 容器 2 插槽中，新增 帳戶通用磁貼 模組。 在模組屬性窗格中的 標題下，輸入 我的個人資料。 在 連結下，設定指向 我的個人資料 頁面的連結。

  10. 在 容器 2 插槽中，新增另一個 帳戶通用圖塊 模組。 在模組屬性窗格中的 標題下，輸入 訂單歷史記錄。 在 連結下，設定指向訂單歷史記錄頁面的連結。

  11. 在 Main 插槽中，再增加一個 Container 模組（Container 3）。 在模組屬性窗格中，將 寬度 值設定為 填滿容器。 將 顯示的子項 值設為 兩個。

  12. 在 容器 3 插槽中，新增 帳戶位址圖塊 模組。 在模組屬性窗格中的 標題下，輸入 我的地址。 在 連結下，設定指向 我的位址 頁面的連結。

  13. 在 容器 3 插槽中，新增 帳戶願望清單圖塊 模組。 在模組屬性窗格中的 標題下，輸入 我的願望清單。 在 連結下，設定指向 我的願望清單 頁面的連結。

  14. 在 Main 插槽中，再增加一個 Container 模組（Container 4）。 在模組屬性窗格中，將 寬度 值設定為 填滿容器。 將 顯示的子項 值設為 兩個。

  15. 在 容器 4 插槽中，新增 組織使用者 模組。 在模組屬性窗格中的 標題下，輸入 組織使用者。

  16. 在 容器 4 插槽中，新增 帳戶客戶餘額磁貼 模組。 在模組屬性窗格中的 標題下，輸入 帳戶信用。

  17. 在 Main 插槽中，再增加一個 Container 模組（Container 5）。 在模組屬性窗格中，將 寬度 值設定為 填滿容器。 將 顯示的子項 值設為 兩個。

  18. 在 容器 5 模組中，新增 帳戶訂單範本圖 模組。 在模組屬性窗格中的 標題下，輸入 訂單範本。

  19. 在 容器 5 模組中，新增 帳戶發票磁貼 模組。 在模組屬性窗格中的 標題下，輸入 發票。

  20. 選擇 儲存，選擇 完成編輯 簽入頁面，然後選擇 發佈 以發布它。

附註

您在步驟 13 到 18 中新增的某些部分不會出現在網站建立器的「所見即所得」(WYSIWIG) 畫布上，因為它們需要登入的 B2B 帳戶。

建立和配置客戶餘額頁面和模組

客戶帳戶可用於支付訂單。 客戶帳戶中的可用餘額可以從使用者的帳戶管理頁面查看。

建立客戶餘額頁面

在登入的 B2B 使用者可以查看其客戶餘額之前，您必須建立客戶餘額頁面。

若要在網站建立器中建立客戶餘額頁面，請依照下列步驟操作。

  1. 使用您先前建立的 帳戶管理 範本建立一個名為 客戶餘額的頁面。
  2. 在 標頭 插槽中，新增使用站點標頭預先配置的標頭片段。
  3. 在 頁腳 插槽中，新增使用網站頁腳預先設定的頁尾片段。
  4. 在 Main 插槽中，再增加一個 Container 模組（Container 3）。 在模組屬性窗格中，將 寬度 值設定為 填滿容器。 將 顯示的子項 值設為 兩個。
  5. 在 Container 插槽中，新增 Breadcrumb 模組。 在模組屬性窗格中的 連結下，設定指向帳戶管理登入頁面的鏈接，然後輸入 我的帳戶 作為連結文字。
  6. 在 容器 插槽中，新增 客戶帳戶餘額 模組。 在模組屬性窗格中的 標題下，輸入 帳戶餘額。
  7. 選擇 儲存，選擇 完成編輯 簽入頁面，然後選擇 發佈 以發布它。
  8. 發布頁面的 URL。
  9. 前往您之前建立的帳戶管理登入頁面（我的帳戶）。
  10. 在 帳戶客戶餘額圖塊 模組的屬性窗格中，新增指向客戶餘額頁面的連結。
  11. 儲存並發布頁面。

客戶餘額頁面現已創建，用戶可以從帳戶管理登入頁面存取它。

配置結帳頁面，以便客戶餘額可以用作付款方式

需要 客戶帳戶付款 模組才能將客戶餘額用作付款方式。 此模組應作為付款方式新增至結帳頁面。 有關如何配置結帳頁面以及結帳所需的模組（包括所有付款詳細資訊）的信息，請參閱 結帳模組。

配置結帳頁面後，您必須將 客戶帳戶付款 模組新增至付款部分，然後儲存並發佈該頁面。 然後，B2B 用戶將能夠登入電子商務網站，並在結帳時將可用的客戶餘額應用於訂單。

此外，在 網站建立器 > 擴充中，您必須確保 啟用客戶帳戶付款 屬性設定為 為 B2B 客戶啟用。

建立訂單模板頁面

B2B 電子商務網站可以設定兩個訂單範本頁面：訂單範本清單頁面和訂單範本行頁面。

訂單範本清單頁面顯示所有可用訂單範本的清單。 它是透過使用 訂單模板清單 模組進行設定的。 訂單模板清單頁面可讓您建立或刪除模板，以及將模板中的商品新增至購物車。

訂單範本行頁面顯示在訂單範本清單頁面上選擇的訂單範本的詳細資訊。 它是透過使用 訂單模板行 模組進行設定的。 當使用者在訂單範本清單頁面上選擇範本名稱時，將出現訂單範本行頁面並顯示範本的詳細資訊。 然後，用戶可以查看和編輯模板中的項目。

建立訂單模板清單頁面

若要在網站建立器中建立訂單範本清單頁面，請依照下列步驟操作。

  1. 使用您先前建立的 帳戶管理 範本建立一個名為 訂單範本的頁面。
  2. 在 標頭 插槽中，新增使用站點標頭預先配置的標頭片段。
  3. 在 頁腳 插槽中，新增使用網站頁腳預先設定的頁尾片段。
  4. 在 Main 插槽中，加入 Container 模組。 在模組屬性窗格中，將 寬度 值設定為 填滿容器。
  5. 在 Container 插槽中，新增 Breadcrumb 模組。 在模組屬性窗格中的 連結下，設定指向帳戶管理登入頁面的鏈接，然後輸入 我的帳戶 作為連結文字。
  6. 在 容器 插槽中，新增 訂單範本清單 模組。
  7. 選擇 儲存，選擇 完成編輯 簽入頁面，然後選擇 發佈 以發布它。
  8. 發布頁面的 URL。
  9. 前往您之前建立的帳戶管理登入頁面（我的帳戶）。
  10. 在 帳戶訂單模板圖塊 模組的屬性窗格中的 鏈接下，配置指向訂單模板的鏈接您剛剛建立的清單頁面。
  11. 儲存並發布頁面。

訂單範本清單頁面現已創建，使用者可以從帳戶管理登陸頁面存取它。

建立訂單模板行頁面

若要在網站建立器中建立訂單範本行頁面，請依照下列步驟操作。

  1. 使用您先前建立的 帳戶管理 範本建立一個名為 訂單範本行的頁面。
  2. 在 標頭 插槽中，新增使用站點標頭預先配置的標頭片段。
  3. 在 頁腳 插槽中，新增使用網站頁腳預先設定的頁尾片段。
  4. 在 Main 插槽中，加入 Container 模組。 在模組屬性窗格中，將 寬度 值設定為 填滿容器。
  5. 在 Container 插槽中，新增 Breadcrumb 模組。 在模組屬性窗格中的 連結下，設定指向帳戶管理登入頁面的鏈接，然後輸入 我的帳戶 作為連結文字。
  6. 在 容器 插槽中，新增 訂單範本行 模組。
  7. 選擇 儲存，選擇 完成編輯 簽入頁面，然後選擇 發佈 以發布它。
  8. 發布頁面的 URL。

加入業務夥伴用戶

組織使用者頁面允許業務合作夥伴組織的管理員將來自該組織的其他使用者加入 B2B 電子商務網站。 它是透過使用 業務組織清單 模組進行設定的。 在組織使用者頁面中，管理員可以新增或刪除使用者、定義帳戶餘額以及要求使用者的報表。

若要在網站建立器中建立組織使用者頁面，請依照下列步驟操作。

  1. 使用您先前建立的 帳戶管理 範本建立一個名為 組織使用者的頁面。
  2. 在 標頭 插槽中，新增使用站點標頭預先配置的標頭片段。
  3. 在 頁腳 插槽中，新增使用網站頁腳預先設定的頁尾片段。
  4. 在 Main 插槽中，加入 Container 模組。 在模組屬性窗格中，將 寬度 值設定為 填滿容器。
  5. 在 Container 插槽中，新增 Breadcrumb 模組。 在模組屬性窗格中的 連結下，設定指向帳戶管理登入頁面的鏈接，然後輸入 我的帳戶 作為連結文字。
  6. 在 容器 插槽中，新增 業務組織清單 模組。 在模組屬性窗格中的 標題下，輸入 組織使用者。
  7. 在 業務組織清單 模組屬性窗格中，啟用 表格排序 和 表格分頁 屬性。 將分頁計數設定為 5。
  8. 選擇 儲存，選擇 完成編輯 簽入頁面，然後選擇 發佈 以發布它。
  9. 發布頁面的 URL。
  10. 前往您之前建立的帳戶管理登入頁面（我的帳戶）。
  11. 在 組織使用者圖塊 模組的屬性窗格中的 連結下，配置指向組織使用者頁面的鏈接您剛剛建立的。
  12. 選擇 儲存，選擇 完成編輯 簽入頁面，然後選擇 發佈 以發布它。

建立發票頁

發票清單頁面顯示所有可用發票的清單。 它是透過使用 InvoicesList 模組進行設定的。 從發票清單頁面，使用者可以付款或索取發票。

發票詳細資訊頁面顯示在發票清單頁面上選擇的發票的詳細資訊。 它是透過使用 發票詳細資料 模組進行設定的。 當使用者在發票清單頁面上選擇發票 ID 時，將出現發票詳細資料頁面並顯示發票的詳細資訊。

建立發票清單頁面

若要在網站建立器中建立發票清單頁面，請依照下列步驟操作。

  1. 使用您先前建立的 帳戶管理 範本來建立名為 發票清單的頁面。
  2. 在 標頭 插槽中，新增使用站點標頭預先配置的標頭片段。
  3. 在 頁腳 插槽中，新增使用網站頁腳預先設定的頁尾片段。
  4. 在 Main 插槽中，加入 Container 模組。 在模組屬性窗格中，將 寬度 值設定為 填滿容器。
  5. 在 Container 插槽中，新增 Breadcrumb 模組。 在模組屬性窗格中的 連結下，設定指向帳戶管理登入頁面的鏈接，然後輸入 我的帳戶 作為連結文字。
  6. 在 Container 插槽中，新增 InvoicesList 模組。 在模組屬性窗格中的 標題下，輸入 發票。
  7. 選擇 儲存，選擇 完成編輯 簽入頁面，然後選擇 發佈 以發布它。
  8. 發布頁面的 URL。
  9. 前往您之前建立的帳戶管理登入頁面（我的帳戶）。
  10. 在 帳戶發票圖塊 模組的屬性窗格中的 連結下，配置發票清單頁面的連結您剛剛創建的。
  11. 選擇 儲存，選擇 完成編輯 簽入頁面，然後選擇 發佈 以發布它。

建立發票詳細資訊頁面

若要在網站建立器中建立發票詳細資訊頁面，請依照下列步驟操作。

  1. 使用您先前建立的 帳戶管理 範本建立一個名為 發票詳細資料的頁面。
  2. 在 標頭 插槽中，新增使用站點標頭預先配置的標頭片段。
  3. 在 頁腳 插槽中，新增使用網站頁腳預先設定的頁尾片段。
  4. 在 Main 插槽中，加入 Container 模組。 在模組屬性窗格中，將 寬度 值設定為 填滿容器。
  5. 在 Container 插槽中，新增 Breadcrumb 模組。 在模組屬性窗格中的 連結下，設定指向帳戶管理登入頁面的鏈接，然後輸入 我的帳戶 作為連結文字。 然後配置一個到發票列表頁面的鏈接，並輸入 發票列表 作為鏈接文本。
  6. 在 容器 插槽中，新增 發票詳細資料 模組。
  7. 選擇 儲存，選擇 完成編輯 簽入頁面，然後選擇 發佈 以發布它。
  8. 發布頁面的 URL。

購物車頁面新增快速新增模組

快速添加模組提供了一種使用商品 ID（也稱為庫存單位 [SKU] ID）快速將多個商品添加到購物車的方法。 快速加入模組被加入到網站的購物車頁面。

若要將快速新增模組新增至 Commerce 網站產生器中的購物車頁面，請依照下列步驟操作。

  1. 前往 範本，然後選擇您網站的購物車頁面範本。
  2. 選取編輯。
  3. 在 預設頁 模組的 主 插槽中，選擇省略號 (. . .），然後選擇 新增模組。
  4. 在 新增模組 對話方塊中，選擇 容器 模組，然後選擇 好的。
  5. 在 容器 插槽中，選擇省略號 (...)，然後選擇 新增模組。
  6. 在 新增模組 對話方塊中，選擇 快速新增 模組，然後選擇 好的。
  7. 選擇 儲存，選擇 完成編輯 以簽入模板，然後選擇 發佈 以發布它。
  8. 前往 頁面，然後選擇您網站的購物車頁面。
  9. 在 預設頁 模組的 主 插槽中，選擇省略號 (. . .），然後選擇 新增模組。
  10. 在 新增模組 對話方塊中，選擇 容器 模組，然後選擇 好的。
  11. 在 容器 模組的屬性窗格中，在 寬度下，選擇 填充容器。
  12. 在 容器 插槽中，選擇省略號 (...)，然後選擇 新增模組。
  13. 在 新增模組 對話方塊中，選擇 快速新增 模組，然後選擇 好的。
  14. 選擇 儲存，選擇 完成編輯 簽入頁面，然後選擇 發佈 以發布它。

附註

快速新增模組自 Commerce 版本 10.0.17 版本起可用。 如果您要從舊版本的 Commerce 進行更新，則必須手動更新 appsettings.json 檔案。 有關說明，請參閱 SDK 和模組庫更新。

商品詳情頁新增大量採購模組

產品詳細資訊頁面 (PDP) 上的大量購買模組提供基於矩陣的體驗，使買家可以快速將產品的多個變體添加到購物車。 當網站使用者必須訂購相同產品的多個變體時，這種體驗無需選擇產品尺寸組合、定義數量、將變體添加到購物車，然後對其他產品尺寸組合重複此過程。

若要將大量購買模組新增至 Commerce 網站產生器中的 PDP，請依照下列步驟操作。

  1. 前往 範本，然後選擇您網站的 PDP 範本。
  2. 選取編輯。
  3. 在 預設頁 模組的 主 插槽中，選擇省略號 (. . .），然後選擇 新增模組。
  4. 在 新增模組 對話方塊中，選擇 容器 模組，然後選擇 好的。
  5. 在 容器 插槽中，選擇省略號 (...)，然後選擇 新增模組。
  6. 在 新增模組 對話方塊中，選擇 大量購買 模組，然後選擇 好的。
  7. 選擇 儲存，選擇 完成編輯 以簽入模板，然後選擇 發佈 以發布它。
  8. 前往 頁面，然後選擇您網站的 PDP。
  9. 在 預設頁 模組的 主 插槽中，選擇省略號 (. . .），然後選擇 新增模組。
  10. 在 新增模組 對話方塊中，選擇 容器 模組，然後選擇 好的。
  11. 在 容器 模組的屬性窗格中，在 寬度下，選擇 填充容器。
  12. 在 容器 插槽中，選擇省略號 (...)，然後選擇 新增模組。
  13. 在 新增模組 對話方塊中，選擇 大量購買 模組，然後選擇 好的。
  14. 選擇 儲存，選擇 完成編輯 簽入頁面，然後選擇 發佈 以發布它。

附註

大量購買模組自 Commerce 版本 10.0.24 版本起可用。 如果您要從舊版本的 Commerce 進行更新，則必須手動更新 appsettings.json 檔案。 有關說明，請參閱 SDK 和模組庫更新。

其他資源

模組庫概述

SDK 和模組庫更新

創作頁面概述

模板和佈局概述

使用片段

新增網站頁面

結帳模組

內容區塊模組

產品採集模組