การกำหนดค่า

ปรับแต่งรูปลักษณ์และพฤติกรรมของวิดเจ็ต

ตัวเลือก Init#

ตัวเลือก	ค่าเริ่มต้น	คำอธิบาย
agentId	จำเป็น*	ID ที่ไม่ซ้ำกันของเอเจนต์ของคุณ *สำหรับวิดเจ็ตแบบมนุษย์ล้วน ใช้แค่ `channelId` อย่างเดียวก็เพียงพอ
channelId	—	ID ของช่องทางวิดเจ็ต ใช้เลือกว่าการตั้งค่าของวิดเจ็ตตัวใด (การจัดรูปแบบ, outbound tooltip/แบนเนอร์) จะถูกใช้เมื่อเอเจนต์เดียวขับเคลื่อนหลายวิดเจ็ต และเป็นตัวระบุเพียงตัวเดียวสำหรับวิดเจ็ตแบบมนุษย์ล้วน ต้องมีอย่างน้อยหนึ่งใน `agentId` / `channelId`
position	bottom-right	`bottom-right` หรือ `bottom-left`
primaryColor	#3B82F6	สีแบรนด์สำหรับปุ่มและส่วนหัวของวิดเจ็ต
title	Support	ข้อความหัวข้อในส่วนหัว
greeting	auto	ข้อความต้อนรับ (โหลดจากการตั้งค่าแดชบอร์ดโดยค่าเริ่มต้น)
language	page	ภาษาของวิดเจ็ตเป็นรหัส BCP-47 (`de`, `pt-BR`) กำหนดอินเทอร์เฟซ ข้อความทักทาย และคำถามด่วน หากไม่ระบุ วิดเจ็ตจะใช้ `<html lang>` ของหน้าเว็บ: หน้าที่มี `lang` ไม่ใช่ `en` จะเริ่มด้วยภาษานั้นทันที ไม่ว่าเบราว์เซอร์ของผู้เยี่ยมชมจะเป็นภาษาใด ส่วน `<html lang="en">` เพียงอย่างเดียวถือเป็นค่าเริ่มต้นของเทมเพลตและถูกละเว้น: ผู้เยี่ยมชมจะได้พฤติกรรมแบบเดิม (ตัวเลือกที่จำไว้ จากนั้นจึงเป็นภาษาของเบราว์เซอร์) ส่ง `'browser'` เพื่อละเว้น `<html lang>` ทั้งหมดและกลับไปใช้พฤติกรรม «เบราว์เซอร์เท่านั้น» เปลี่ยนได้ขณะทำงานด้วย `Respondo.setLanguage('fr')` — เหมาะกับตัวสลับภาษาที่ไม่โหลดหน้าใหม่
placeholder	—	ข้อความ placeholder ของช่องกรอกแบบกำหนดเอง
quickQuestions	—	อาร์เรย์ของคำถามแนะนำที่แสดงก่อนข้อความแรก
logoUrl	—	URL ของโลโก้ที่แสดงในส่วนหัวของวิดเจ็ต
avatarUrl	—	URL ของอวาตาร์ AI เอเจนต์ที่แสดงข้างข้อความ
identity	—	กำหนดตัวตนผู้ใช้ล่วงหน้าตอน init (ฟิลด์เดียวกับ `identify()`)
localStorageKey	—	คีย์ localStorage สำหรับอ่าน `userId` โดยอัตโนมัติ (สำหรับการตั้งค่าแบบ GTM / no-code)
chatSize	default	`compact`, `default`, หรือ `large` — ขนาดหน้าต่างแชท
launcherSize	default	`small`, `default`, หรือ `large` — ขนาดปุ่ม launcher
offsetBottom	20	ระยะห่างจากขอบล่าง (px)
offsetSide	20	ระยะห่างจากขอบซ้าย/ขวา (px)
borderRadius	20	ความโค้งขอบหน้าต่างแชท (px)
zIndex	999999	CSS z-index สำหรับคอนเทนเนอร์วิดเจ็ต
customCSS	—	CSS แบบกำหนดเองที่แทรกเข้าใน Shadow DOM ของวิดเจ็ตสำหรับการจัดรูปแบบขั้นสูง
testMode	false	ทำเครื่องหมายบทสนทนาว่าเป็นการทดสอบ (ซ่อนจากมุมมองหลัก)

การกำหนดค่าแบบเต็ม#

การกำหนดค่าแบบเต็มjavascript

Respondo.init({
  agentId: 'YOUR_AGENT_ID',
  channelId: 'YOUR_CHANNEL_ID',
  position: 'bottom-right',        // 'bottom-right' | 'bottom-left'
  primaryColor: '#2563eb',
  language: 'de',                  // BCP-47; ค่าเริ่มต้น: <html lang> (en = สัญญาณอ่อน), 'browser' จะละเว้นค่านี้
  title: 'Help Center',
  greeting: 'How can we help?',
  placeholder: 'Ask anything...',
  logoUrl: 'https://yoursite.com/logo.png',
  avatarUrl: 'https://yoursite.com/avatar.png',
  quickQuestions: [
    'How do I get started?',
    'What are the pricing plans?',
    'How do I contact support?'
  ],
  testMode: false,
  localStorageKey: 'myapp_user_id', // อ่าน userId จาก localStorage โดยอัตโนมัติ (GTM / no-code)
  chatSize: 'default',              // 'compact' | 'default' | 'large'
  offsetBottom: 20,                 // ระยะห่างจากด้านล่าง (px)
  identity: {                      // ทางเลือก: กำหนดตอน init หากรู้จักผู้ใช้อยู่แล้ว
    email: 'user@example.com',
    name: 'John Doe',
    userId: 'usr_123',
    properties: {                  // คุณสมบัติของผู้ติดต่อแบบกำหนดเอง
      account_type: 'enterprise',
      region: 'eu-west'
    }
  }
});

การตั้งค่าส่วนใหญ่ (สี, โลโก้, ข้อความต้อนรับ, คำถามด่วน) จัดการได้จากแดชบอร์ด Channels วิดเจ็ตจะดึงค่าเหล่านี้ตอนโหลด — คุณต้องการเพียงคู่ agentId/channelId จากโค้ดฝังเท่านั้น