自訂整合

將端對端 Checkout 整合建立到您的自訂網站中。

整合檢查清單 

請按照此綜合檢查清單設定您的 Zonos Dashboard 帳戶,並將 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 中的分類,然後輸入您的產品名稱和說明以產生準確的 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需要將 Checkout 訂單傳送到您的原生平台。文件 →
ORDER_STATUS_CHANGED在訂單狀態變更時保持您的系統與 Zonos 同步(例如,已履行、已取消)。文件 →

在使用您的 Checkout 整合上線之前,請務必徹底測試整合的所有層面,以確保順暢的客戶體驗。這包括測試結帳流程、付款處理、訂單建立和 webhook 功能。

請按照我們的測試指南來驗證您的整合是否正確運作,以及在啟動到生產環境之前識別並修復任何問題。

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

Zonos 如何處理訂單確認? 

Dashboard -> Settings -> Checkout settings 下的 Success page type 中設定購後體驗。有三個選項可用:

  • Show Zonos success page(預設值,建議)— Zonos 在下單後顯示內建感謝頁面。該頁面始終顯示,即使訂單無法匯入您的系統,因此購物者始終獲得確認。
  • Redirect to a success page — Zonos 在簡短的「訂單完成」螢幕上等待,直到訂單建立,然後重新導向到您設定的成功 URL,並附加 zOrderNumber(以及舊版購物車的 orderId)作為查詢參數。
  • Close the checkout modal — 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 請求標題。

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

是的。如果您想在建立訂單時接收通知,請在 Checkout settingsEmail 區段中的 Dashboard 中,輸入應在建立、出貨或取消訂單時收到通知的團隊成員的電子郵件地址。