Gunakan pengecam yang betul
ID produk hadapan kedai, SKU atau ID varian bukan ID pakaian SPREEAI secara automatik. Kekalkan pemetaan yang dibuat melalui pengingesan atau aliran kerja penyegerakan Shopify anda. Pakaian mestilah milik rakan kongsi yang disahkan dan tersedia untuk dicuba.
Petakan pemilihan produk
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 boleh menapis warna, sesuai, jantina dan gaya. Pemadanan yang didokumenkan adalah tidak peka huruf besar-besaran. Padankan warna dengan namanya, seperti blue, bukannya dengan nilai heks.
Kesediaan pakaian
| Keadaan atau keadaan | Tindakan integrasi |
|---|---|
| Tidak disegerakkan / pengingesan tidak lengkap | Kekalkan pengalaman produk biasa; jangan menjanjikan ketersediaan percubaan. |
| Sedia tetapi dilumpuhkan dalam Shopify | Semak dan dayakan secara eksplisit produk yang dimaksudkan. Bersedia sahaja tidak menjadikannya hidup. |
| Pakaian tersedia dan varian yang sepadan | Render butang untuk pemilihan itu. |
| Tiada pakaian tersedia yang sepadan | Jangkakan sandaran kepada pakaian pertama dalam tatasusunan. |
| Pengesahan gagal | Tiada butang diberikan; menyiasat konsol dan pemetaan produk. |
Pastikan data produk terkini
- Kemas kini harga yang dipaparkan dan saiz dalam stok apabila pilihan produk berubah.
- Gunakan ID bekas unik untuk butang produk yang berasingan.
- Apabila memaparkan semula butang, lulus pilihan pakaian dan varian semasa.
- Semak data troli yang dikembalikan terhadap katalog anda sendiri sebelum membuat mutasi troli.
Sediakan aset pakaian
Gunakan arus standard imej pakaian untuk imejan dan metadata yang disokong. Selesaikan isu pemprosesan sebelum mendayakan produk; jangan gantikan ID pakaian pemegang tempat untuk data pengeluaran.