自訂整合

為您的自訂網站建立端到端的 Checkout 整合。

整合檢查清單 

按照本綜合檢查清單設定您的 Zonos 控制板帳戶,並將 Zonos Checkout 整合至您的自訂網站或平台。

若要開始,請聯絡我們的銷售團隊以建立帳戶並簽署協議。簽署協議後,您將在帳戶中收到兩筆小額存款,需要驗證。

請將這些小額存款金額電郵至 accounting@zonos.com,並附上您的 Dashboard 商店 ID(抄送給您的銷售代表)。

驗證後,您的銀行詳細資訊將顯示在 Dashboard -> Settings -> Billing

建立 Zonos 帳戶後,您需要在 Dashboard 中設定設定,以確保 Checkout 正常運作。本部分涵蓋所有必要的 Dashboard 設定。

設定支付

連接銀行帳戶以從 Checkout 接收及時的支付。支付在捕獲付款後的 2 天延遲內每日處理。若要執行此操作,請按照以下步驟進行:

  1. 導航至 Dashboard -> Settings -> Checkout settings
  2. 按一下 Add bank account
  3. 您將被帶至 Stripe 入口網站以完成設定並提供以下資訊:
    • 銀行帳戶資訊。
    • 公司 EIN。
    • 持有 25% 公司股份的人的社會保險號碼。如需詳細資訊,請參閱 Stripe 的文件

注意: 如果您需要更新支付時程表,請聯絡 support@zonos.com

設定允許的網域

Zonos JS 指令碼出於安全目的需要允許網域清單。這可防止未經授權的網站載入指令碼,並確保它僅在您核准的網域上執行。沒有此設定,指令碼將傳回權限錯誤。

若要設定此項目:

  1. 導航至 Dashboard -> Settings -> Checkout settings
  2. URLs 下,新增您的完整網域及將使用 Checkout 的任何子網域。例如,如果您的網域是 example.com,您應該新增 example.comtest.example.com

自訂品牌設定

在 Dashboard 中設定您的品牌設定以符合您商店的外觀和風格。

若要執行此操作,請按照以下步驟進行:

  1. 導航至 Dashboard -> Settings -> Checkout settings -> Branding
  2. 設定以下設定:
    • 標誌。
    • 品牌和重點色彩。
    • 主題、樣式和字型。

如需品牌設定的詳細資訊,請參閱我們的文件

連接運輸承運商

若要在結帳時報價運輸,您需要將運輸承運商連接到您的 Zonos 帳戶。這將允許您在結帳時啟用特定的運輸服務級別。

若要連接運輸承運商,請按照以下步驟進行:

  1. 導航至 Dashboard -> Settings -> Shipping -> Rates
  2. 按一下 Add carrier
  3. 按照承運商設定說明進行。

如需連接承運商帳戶的詳細資訊,請參閱我們的文件

設定運輸區域

運輸區域允許您設定世界不同地區可用的運輸承運商和服務級別。

若要設定運輸區域,請按照以下步驟進行:

  1. 導航至 Dashboard -> Settings -> Shipping -> Locations
  2. 按一下 New zone
  3. 輸入區域名稱並選擇要運送的國家。
  4. 選擇您要提供的承運商和服務級別。

如需運輸區域的詳細資訊,請參閱我們的文件

設定後備原產地國家和 HS 代碼 

原產地國家和 HS 代碼用於計算準確的關稅和稅費。

如果您未提供特定的原產地國家或 HS 代碼,我們將使用在 Dashboard 中設定的後備。

若要設定後備原產地國家和 HS 代碼:

  1. 導航至 Dashboard -> Settings -> Shipping -> Catalog
  2. 對於原產地國家,選擇您的大部分產品製造所在的國家。
  3. 對於 HS 代碼,輸入您最常見產品的 HS 代碼。如果您沒有 HS 代碼,請導航至 Dashboard 中的Classify,並輸入您的產品名稱和說明以生成準確的 HS 代碼。

Zonos JS 片段是用戶端 JavaScript 整合,可在您的網站上啟用全球結帳功能。它充當您的電子商務平台和 Zonos 服務之間的橋樑,處理以下事項:

  • 結帳體驗:呈現結帳 UI 並處理付款。
  • 位置服務:檢測訪客位置並管理貨幣轉換。
  • 購物車整合:連接到您現有的購物車和訂單系統。
  • 安全性:驗證網域並驗證 API 要求。

該片段以非同步方式載入,以防止對您網站性能的任何影響。它使用您商店的 API 認證進行初始化,並安全地處理所有用戶端交互。該實現被設計為非侵入式,需要對現有結帳流程進行最少的更改。

以下是一個完整示例,包括指令碼載入、初始化和事件處理,可在整合 Checkout 時參考。

1
  1. 透過您的 Checkout customHTML 傳遞相應的 ID,以便中繼知道要針對哪個屬性/像素觸發:
1

如需逐步 iframe 說明、完整事件參考(包括 purchase / Purchase 裝載映射)和偵錯提示,請參閱:

若要在您的系統和 Zonos Dashboard 之間同步訂單,請實現這些 API 呼叫和 Webhook:

必需的變異

變異說明
orderUpdateAccountOrderNumber將您的原生帳戶號碼與 Dashboard 同步。文件 →
orderAddTrackingNumber僅在您不在 Dashboard 中列印標籤時需要。確保追蹤顯示在 Dashboard 中,以便 Zonos 可以保證您的著陸成本計算。文件 →

必需的 Webhook 

Webhook說明
ORDER_CREATED需要將結帳訂單傳送至您的原生平台。文件 →
ORDER_STATUS_CHANGED當訂單狀態改變時(例如履行、取消)保持您的系統與 Zonos 同步。文件 →

在您的 Checkout 整合上線之前,重要的是徹底測試整合的所有方面,以確保順暢的客戶體驗。這包括測試結帳流程、付款處理、訂單建立和 Webhook 功能。

遵循我們的測試指南以驗證您的整合工作正常,並在啟動到生產環境前識別並修復任何問題。

以下是有關整合流程的常見問題。

Zonos 如何處理訂單確認? 

Dashboard -> Settings -> Checkout settings 下的成功頁面類型中設定購後體驗。可用三個選項:

  • 顯示 Zonos 成功頁面(預設值,建議)— Zonos 在訂單下達後顯示內建的感謝頁面。該頁面始終顯示,即使訂單未能匯入您的系統,因此購物者始終獲得確認。
  • 重新導向到成功頁面 — Zonos 在簡短的「訂單完成」螢幕上等待,直到訂單建立,然後重新導向到您設定的成功 URL,並將 zOrderNumber(以及 orderId 用於舊版購物車)附加為查詢參數。
  • 關閉結帳模態 — Zonos 在捕獲付款後關閉其模態。如果您還設定了成功 URL,Zonos 會在 Stripe 收集付款後立即重新導向到該 URL — 不等待訂單建立 — 並將 zonosCheckoutSessionId 附加為查詢參數。當您想要最快交接回您自己的成功頁面時,請使用此選項。

zonosCheckoutSessionId 查詢訂單 

當您使用關閉結帳模態搭配重新導向 URL 時,訂單在重新導向後可能需要幾秒鐘才能附加到結帳會話。從 URL 讀取 zonosCheckoutSessionId 並使用您的秘密認證令牌輪詢 checkoutSession GraphQL 查詢,直到訂單準備就緒。絕不要從瀏覽器呼叫此項目 — 秘密認證令牌必須保持伺服器端。

1query getCheckoutSession($id: String!) {
2 checkoutSession(id: $id) {
3 order {
4 id
5 }
6 }
7}

將查詢傳送至 https://api.zonos.com/graphql,並將您的秘密認證令牌(來自 Dashboard -> Settings -> Integrations)作為 credentialToken 要求標頭傳遞。

訂單建立時可以通知我嗎?

可以。如果您想在訂單建立時收到通知,在 Dashboard 的 Checkout settings電郵部分中,您可以輸入應在訂單建立、運送或取消時獲得通知的團隊成員的電郵地址。