คู่มือเริ่มต้นใช้งาน Web SDK อย่างรวดเร็ว

ก่อนที่คุณจะเริ่ม

• A clientId ออกโดย SPREEAI สําหรับสภาพแวดล้อมที่ได้รับอนุมัติของคุณ
• เสื้อผ้าที่นําเข้าเสร็จแล้วเป็นของบัญชีของคุณและสามารถลองใส่ได้
• หน้าผลิตภัณฑ์ที่คุณสามารถแก้ไขได้และคอนเทนเนอร์ที่มีรหัส HTML ที่ไม่ซ้ํากัน

1. ติดตั้ง

npm install @spreeai/web-sdk@3.0.0

สไตล์ชีตเป็นส่วนหนึ่งของแพ็กเกจและต้องรวมอยู่ในชุดรวมของคุณ

2. เพิ่มภาชนะ

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

3. เริ่มต้นและเรนเดอร์

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() สามารถกลับมาได้ null. ตรวจสอบผลลัพธ์ก่อนแสดงผล และเริ่มต้นหนึ่งครั้งต่อหน้า แทนที่จะเริ่มต้นสําหรับแต่ละปุ่ม

4. ตรวจสอบผลลัพธ์

1. โหลดหน้าสินค้า. เสื้อผ้าที่ถูกต้องและพร้อมใช้งานจะแสดงปุ่มลองสวม
2. เปิดห้องลองและยืนยันเสื้อผ้าและสีที่ต้องการ
3. ปิดและเปิดใหม่อีกครั้ง ตรวจสอบประสบการณ์บนโทรศัพท์และเดสก์ท็อป
4. ลองใช้ชุดที่ไม่มีจําหน่ายในสภาพแวดล้อมการทดสอบของคุณ ยืนยันว่าผลิตภัณฑ์ปกติและเส้นทางการชําระเงินของคุณยังคงใช้งานได้

ต่อไปจะไปไหน.