Gebruik de juiste identificatie
Een product-ID, SKU of variant-ID van een winkel is niet automatisch een SPREEAI-kledingstuk-ID. Onderhoud een toewijzing die is gemaakt via uw opname- of Shopify-synchronisatieworkflow. Het kledingstuk moet eigendom zijn van de geverifieerde partner en beschikbaar zijn om te passen.
Breng een productselectie in kaart
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 kleur, pasvorm, geslacht en stijl filteren. Gedocumenteerde overeenkomsten zijn niet hoofdlettergevoelig. Match de kleur op basis van de naam, zoals blue, in plaats van met een hexadecimale waarde.
Kleding gereedheid
| Staat of toestand | Integratie actie |
|---|---|
| Niet gesynchroniseerd / opname onvolledig | Behoud de normale productervaring; beloof geen proefbeschikbaarheid. |
| Klaar maar uitgeschakeld in Shopify | Controleer het beoogde product en schakel het expliciet in. Alleen klaar maakt het niet levend. |
| Beschikbaar kledingstuk en bijpassende variant | Render de knop voor die selectie. |
| Geen bijpassende beschikbare outfit | Verwacht een terugval naar het eerste kledingstuk in de reeks. |
| Validatie mislukt | Er wordt geen knop weergegeven; onderzoek de console- en producttoewijzing. |
Houd productgegevens actueel
- Update de weergegeven prijs en maten die op voorraad zijn wanneer de productselectie verandert.
- Gebruik unieke container-ID's voor afzonderlijke productknoppen.
- Wanneer u een knoop opnieuw rendert, geeft u het huidige kledingstuk en de variantselectie door.
- Controleer de geretourneerde winkelwagengegevens met uw eigen catalogus voordat u een winkelwagenmutatie aanmaakt.
Kledingstukken voorbereiden
Gebruik de stroom normen voor kledingimago's voor ondersteunde afbeeldingen en metadata. Verwerkingsproblemen oplossen voordat producten worden ingeschakeld; vervang de productiegegevens niet door tijdelijke kleding-ID's.