Utilice el identificador correcto
Un ID de producto, SKU o ID de variante de escaparate no es automáticamente un ID de prenda SPREEAI. Mantenga una asignación creada a través de su ingesta o flujo de trabajo de sincronización Shopify. La prenda debe pertenecer al socio autenticado y estar disponible para probarse.
Mapear una selección de productos
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 Puede filtrar color, ajuste, género y estilo. Las coincidencias documentadas no distinguen entre mayúsculas y minúsculas. Haga coincidir el color por su nombre, como blue, en lugar de por un valor hexadecimal.
Preparación de la prenda
| Estado o condición | Acción de integración |
|---|---|
| No sincronizado/ingestión incompleta | Mantenga la experiencia normal del producto; no prometa disponibilidad de prueba. |
| Listo pero deshabilitado en Shopify | Revise y habilite explícitamente el producto previsto. Estar listo por sí solo no lo hace vivir. |
| Prenda disponible y variante a juego. | Representa el botón para esa selección. |
| No hay outfit disponible a juego | Espere recurrir a la primera prenda de la gama. |
| La validación falla | No se representa ningún botón; Investigue la consola y el mapeo del producto. |
Mantenga los datos del producto actualizados
- Actualice el precio mostrado y los tamaños en stock cuando cambie la selección de productos.
- Utilice ID de contenedor únicos para botones de productos separados.
- Al volver a representar un botón, pase la prenda actual y la selección de variante.
- Revise los datos del carrito devuelto con su propio catálogo antes de crear una mutación del carrito.
Preparar activos de prendas.
Usa la corriente estándares de imagen de prendas para imágenes y metadatos compatibles. Resolver problemas de procesamiento antes de habilitar productos; no sustituya los ID de prendas de marcador de posición por datos de producción.