Panduan singkat Web SDK

Sebelum Anda mulai

• A clientId dikeluarkan oleh SPREEAI untuk lingkungan yang Anda setujui.
• Pakaian yang telah selesai diserap, menjadi milik akun Anda dan tersedia untuk dicoba.
• Halaman produk yang dapat Anda edit dan wadah dengan ID HTML unik.

1. Instal

npm install @spreeai/web-sdk@3.0.0

Stylesheet adalah bagian dari paket dan harus disertakan dalam bundel Anda.

2. Tambahkan wadah

<div id="spreeai-try-on"></div>

3. Inisialisasi dan render

import { init } from "@spreeai/web-sdk";
import "@spreeai/web-sdk/dist/web-sdk.css";

// Add <div id="spreeai-try-on"></div> to your product page.
const sdk = await init({ clientId: "YOUR_ISSUED_CLIENT_ID" });

if (sdk) {
  await sdk.renderTryOnButton({
    elementId: "spreeai-try-on",
    garments: [{ garmentId: "YOUR_READY_GARMENT_ID" }],
  });
} else {
  // Keep the normal product and purchase journey available.
  console.warn("SPREEAI could not initialize.");
}

init() bisa kembali null. Periksa hasilnya sebelum rendering, dan inisialisasi satu kali per halaman, bukan untuk setiap tombol.

4. Periksa hasilnya

1. Muat halaman produk. Pakaian yang valid dan tersedia akan menampilkan tombol uji coba.
2. Buka ruang pas dan konfirmasikan pakaian dan warna yang diinginkan.
3. Tutup dan buka kembali. Periksa pengalaman di ponsel dan desktop.
4. Cobalah pakaian yang tidak tersedia di lingkungan pengujian Anda. Konfirmasikan produk normal Anda dan jalur pembayaran tetap dapat digunakan.

Ke mana harus pergi selanjutnya