Brug den rigtige identifikator
Et butiksfacade-produkt-id, SKU eller variant-id er ikke automatisk et SPREEAI-beklædnings-id. Vedligehold en kortlægning, der er oprettet gennem din indtagelse eller Shopify synkroniseringsarbejdsgang. Tøjet skal tilhøre den autentificerede partner og være tilgængeligt til prøvning.
Kortlæg et produktudvalg
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 kan filtrere farve, pasform, køn og stil. Dokumenteret matching skelner mellem store og små bogstaver. Match farve efter dens navn, som f.eks blue, snarere end med en hex-værdi.
Beklædningsklarhed
| Tilstand eller tilstand | Integrationsaktion |
|---|---|
| Ikke synkroniseret / indtagelse ufuldstændig | Hold den normale produktoplevelse; lover ikke prøve-på tilgængelighed. |
| Klar, men deaktiveret i Shopify | Gennemgå og aktiver eksplicit det tilsigtede produkt. Klar alene gør det ikke live. |
| Tilgængelig beklædningsgenstand og matchende variant | Gengiv knappen for det valg. |
| Intet matchende tilgængeligt outfit | Forvent tilbagefald til den første beklædningsgenstand i arrayet. |
| Validering mislykkes | Ingen knap gengives; undersøge konsollen og produktkortlægningen. |
Hold produktdata opdateret
- Opdater viste pris og lagerstørrelser, når produktudvalget ændres.
- Brug unikke container-id'er til separate produktknapper.
- Når du gengiver en knap, skal du bestå det aktuelle tøj- og variantvalg.
- Gennemgå de returnerede kurvdata mod dit eget katalog, før du opretter en kurvmutation.
Forbered beklædningsgenstande
Brug den nuværende standarder for beklædningsgenstand for understøttede billeder og metadata. Løs behandlingsproblemer, før du aktiverer produkter; Udskift ikke produktionsdata med pladsholderbeklædnings-id'er.