Widget API

สำหรับนักพัฒนา หรือใครก็ตามที่ต้องการให้แชทเปิดขึ้นจากปุ่มบนเว็บไซต์ของคุณเอง

การติดตั้ง

<script src="https://keyda.in/business/widget.js"
        data-key="kb_live_your_key_here" async></script>

แท็กสคริปต์ต้องการเพียง src และ data-key เท่านั้น ส่วนที่เหลือ — สี ตำแหน่ง คำทักทาย ภาษา — มาจากแดชบอร์ดของคุณ คุณจึงไม่ต้องปรับใช้เว็บไซต์ใหม่เพื่อเปลี่ยนสิ่งเหล่านี้

วิดเจ็ตจะแสดงผลเป็นภาษาที่ตั้งไว้ที่ ติดตั้ง → ภาษาที่บอทของคุณพูด: ปุ่ม ข้อความตัวอย่าง และการแจ้งเตือน รวมถึงทิศทางการจัดวาง (อาหรับและอูรดูจัดจากขวาไปซ้าย) ข้อความเหล่านี้มาพร้อมกับการตั้งค่าของวิดเจ็ต จึงไม่มีการเรียกข้อมูลครั้งที่สองและไม่มีอะไรที่คุณต้องแปลเอง

โหมดต่างๆ

แบบลอย (ค่าเริ่มต้น) ปุ่มเปิดใช้งานที่มุมหน้าจอสำหรับเปิดแผงแชท

แบบฝังในหน้าเว็บ (Inline) วางคอนเทนเนอร์ว่างไว้บนหน้าเว็บ แล้วแชทจะแสดงผลในส่วนนั้นแทน:

<div data-keyda-bot style="height:520px"></div>

คอนเทนเนอร์จำเป็นต้องมีความสูง ในโหมดอินไลน์แชทจะแสดงผลตลอดเวลา จึงไม่มีปุ่มให้เปิดหรือปิด

JavaScript API

ใช้งานได้บน window.KeydaBot เมื่อโหลดสคริปต์เรียบร้อยแล้ว:

ตัวอย่าง — เปิดแชทจากปุ่ม "แชทกับเรา" ของคุณเอง:

<button onclick="KeydaBot.open()">Chat with us</button>

พฤติกรรมการทำงานบนหน้าเว็บของคุณ

• แผงแชทจะเปิดขึ้น เหนือ ปุ่มเปิดแชท ซึ่งปุ่มนั้นจะอยู่ที่เดิมและเปลี่ยนเป็นปุ่มปิดแทน การแตะปุ่มเดิมอีกครั้ง การกดเครื่องหมาย ✕ ที่ส่วนหัว หรือการกดปุ่ม Escape จะเป็นการปิดแชท
• ผู้เยี่ยมชมสามารถ ขยาย แผงควบคุมจากส่วนหัวได้ โดยจะขยายเต็มความสูงของหน้าต่างและกว้างสูงสุด 760px ซึ่งเบราว์เซอร์จะจดจำการตั้งค่านี้ไว้ สำหรับโทรศัพท์มือถือแผงควบคุมจะแสดงเต็มหน้าจออยู่แล้ว จึงไม่มีปุ่มควบคุมนี้แสดงให้เห็น
• การตั้งค่า ขนาดโลโก้ ของคุณเปลี่ยนแค่โลโก้ ไม่ใช่ตัวปุ่ม ตัวเปิดแชทจะคงขนาดเดิมและโลโก้จะขยายอยู่ภายใน ส่วน ขนาดปุ่ม (ติดตั้ง → รูปลักษณ์) คือสิ่งที่ปรับขนาดตัวปุ่มเอง — เล็ก กลาง หรือใหญ่ — ไม่ว่าจะเป็นรูปทรงใดก็ตาม
• ปุ่มมีสี่รูปทรง: แคปซูลพร้อมป้ายข้อความของคุณ บับเบิลกลม สี่เหลี่ยมมุมมน และบับเบิลแชทที่มีหาง หางจะอยู่ด้านที่หันเข้าหาหน้าเว็บของคุณ
• ทุกอย่างจะแสดงผลภายใน shadow root ดังนั้น CSS ของคุณจะไม่ทำให้วิดเจ็ตพัง และ CSS ของวิดเจ็ตก็จะไม่ส่งผลกระทบต่อเว็บไซต์ของคุณ
• แผงควบคุมจะโหลดเฉพาะเมื่อผู้เข้าชมเปิดใช้งานเท่านั้น จึงไม่ทำให้หน้าเว็บของคุณช้าลง
• การสนทนาของผู้เยี่ยมชมจะดำเนินต่อไปอีก 24 ชั่วโมงหากพวกเขากลับมา จากนั้นจะเริ่มต้นใหม่ การเปิดแผงแชทอีกครั้งจะเรียกคืนบทสนทนาเดิม — รวมถึงไฟล์ต่างๆ และคำถามในโฟลว์ต้อนรับที่ยังรอคำตอบอยู่
• ไอคอนคลิปหนีบกระดาษ ในช่องพิมพ์ช่วยให้ผู้เยี่ยมชมแนบรูปภาพหรือเอกสารได้สูงสุดสามไฟล์ต่อข้อความ (ขนาดและประเภทไฟล์อยู่ใน ขีดจำกัดและความปลอดภัย) รูปภาพจะถูกลดขนาดในเบราว์เซอร์ก่อนอัปโหลด ดังนั้นภาพถ่าย 12 ล้านพิกเซลจะออกจากหน้าเว็บด้วยขนาดเพียงไม่กี่ร้อยกิโลไบต์ ปิดไฟล์ที่หน้า ติดตั้ง แล้วปุ่มนี้จะหายไป
• โฟลว์ต้อนรับ ทำงานเป็นบับเบิลข้อความทั่วไป: ตัวเลือกจะกลายเป็นปุ่มอยู่ใต้บับเบิล ปุ่มข้ามจะปรากฏขึ้นเมื่อขั้นตอนนั้นไม่บังคับ และข้อความตัวอย่างในช่องพิมพ์จะกลายเป็นคำถาม โฟลว์ที่ทำเสร็จแล้วจะถูกจดจำไว้ในเบราว์เซอร์ของผู้เยี่ยมชมเป็นเวลา 30 วัน
• หากไม่สามารถติดต่อผู้ช่วยได้ วิดเจ็ตจะแสดงข้อความสั้น ๆ และจะไม่ทำให้หน้าเว็บของคุณเกิดข้อผิดพลาด

ภายใน SDK ของแอป

แชทเดียวกันทำงานได้ในทุก SDK ไฟล์แนบและโฟลว์ต้อนรับจึงมาถึงแอปของคุณโดยไม่ต้องออกเวอร์ชันใหม่ — ยกเว้นกรณีเดียว การเปิดตัวเลือกไฟล์จาก web view เป็นหน้าที่ของแอปโฮสต์ แพ็กเกจ iOS, React Native และ Ionic ทำหน้าที่นี้อยู่แล้ว; Android และ Flutter ต้องใช้ SDK 0.1.4 ขึ้นไป ในเวอร์ชันเก่ากว่านั้น วิดเจ็ตจะจดจำแอปโฮสต์และซ่อนไอคอนคลิปหนีบกระดาษแทนที่จะแสดงปุ่มที่ใช้งานไม่ได้