使用正確的標識符
店面產品 ID、SKU 或款式 ID 不會自動成為 SPREEAI 服裝 ID。維護透過您的攝取或 Shopify 同步工作流程所建立的對應。該服裝必須屬於經過認證的合作夥伴並且可供試穿。
繪製產品選擇圖
TypeScript
import type { RenderTryOnButtonOptions } from "@spreeai/web-sdk";
export const productOptions: RenderTryOnButtonOptions = {
elementId: "spreeai-try-on",
garments: [{
garmentId: "SPREEAI_GARMENT_ID",
variant: { color: "blue", fit: "regular" },
availableSizes: ["S", "M", "L"],
price: "$59.00",
}],
showSizes: true,
showPrices: true,
};variant 可以過濾顏色、款式、性別和風格。記錄的匹配不區分大小寫。按顏色名稱匹配顏色,例如 blue,而不是十六進制值。
成衣準備
| 狀態或條件 | 整合行動 |
|---|---|
| 未同步/攝取不完整 | 保持正常的產品體驗;不承諾試穿可用性。 |
| 就緒但在 Shopify 中停用 | 檢查並明確啟用預期產品。僅僅準備好並不能使其成功。 |
| 可用的服裝和配套款式 | 渲染該選擇的按鈕。 |
| 沒有匹配的可用服裝 | 預計會退回到陣列中的第一件衣服。 |
| 驗證失敗 | 沒有呈現任何按鈕;研究控制台和產品映射。 |
保持產品數據最新
- 當產品選擇變更時,更新顯示的價格和庫存尺寸。
- 對單獨的產品按鈕使用唯一的容器 ID。
- 重新渲染按鈕時,傳遞當前服裝和變體選擇。
- 在創建購物車突變之前,請根據您自己的目錄查看返回的購物車數據。
準備服裝資產
使用目前 服裝形象標準 用於支援的影像和元資料。在啟用產品之前解決處理問題;不要用佔位符服裝 ID 取代生產資料。