# ตั้งค่าแชทวิดเจ็ต

#### วิธีตั้งค่าและปรับแต่งแชทวิดเจ็ตสำหรับเว็บไซต์

แชทวิดเจ็ตสำหรับเว็บไซต์ช่วยให้คุณสามารถมีส่วนร่วมกับผู้เข้าชมเว็บไซต์ เก็บข้อมูลลูกค้าเป้าหมาย และให้การสนับสนุนได้ทันทีโดยตรงจากกล่องข้อความ Zaapi ของคุณ

คู่มือนี้จะแนะนำคุณตลอดขั้นตอนการสร้าง ตั้งค่า และติดตั้งแชทวิดเจ็ตใหม่ของคุณ

***

#### 1. การสร้างแชทวิดเจ็ตใหม่

ขั้นแรก คุณต้องสร้างวิดเจ็ตจากการตั้งค่า Zaapi ของคุณ

1. ไปที่ การตั้งค่า (Settings) ในเมนูหลัก
2. เลือก การเชื่อมต่อ (Integrations)
3. เลื่อนลงไปที่ส่วน "ค้นพบ" (Discover) และค้นหาการ์ด แชทวิดเจ็ตสำหรับเว็บไซต์ (Website Chat Widget)
4. คลิกปุ่ม + สร้าง (+ Create) เพื่อเริ่มกระบวนการตั้งค่า

***

#### 2. การตั้งค่าวิดเจ็ต

หลังจากสร้างวิดเจ็ตแล้ว คุณจะถูกนำไปยังหน้าการตั้งค่า หน้านี้มี 4 แท็บหลัก: รูปแบบ (Appearance), เนื้อหาและภาษา (Content & language), การตั้งค่า (Settings), และ การติดตั้ง (Install)

**A. แท็บรูปแบบ (Appearance)**

แท็บนี้ใช้ควบคุมรูปแบบการแสดงผลและการจัดวางแชทวิดเจ็ตบนเว็บไซต์ของคุณ

* ดีไซน์วิดเจ็ต: เลือกว่าต้องการให้วิดเจ็ตในรูปแบบย่อแสดงผลอย่างไร
  * ปุ่มกลม (Bubble): ไอคอนวงกลม (ค่าเริ่มต้น)
  * แถบ (Bar): แถบสี่เหลี่ยมพร้อมข้อความสั้นๆ
* ธีมสี: เลือกสีที่เข้ากับเอกลักษณ์ของแบรนด์คุณ สีที่เลือกจะถูกนำไปใช้กับส่วนหัวและปุ่มของวิดเจ็ต คุณสามารถปรับแต่งสีเพิ่มเติมได้โดยการป้อนรหัสสี hex ของแบรนด์คุณ
* ตำแหน่งการจัดวาง: เลือกว่าจะให้วิดเจ็ตปรากฏทางด้าน ซ้าย หรือ ขวา ของเว็บไซต์

**B. แท็บเนื้อหาและภาษา (Content & language)**

แท็บนี้ช่วยให้คุณควบคุมข้อความทั้งหมดที่แสดงในวิดเจ็ตและตั้งค่าได้หลายภาษา

* เลือกภาษา: วิดเจ็ตสามารถแสดงผลตามภาษาของเบราว์เซอร์ผู้เข้าชมได้โดยอัตโนมัติ คลิกที่กล่องภาษาเพื่อเลือกภาษาทั้งหมดที่คุณต้องการรองรับ
  * สำคัญ: คุณต้องกรอกข้อความในช่องที่จำเป็นให้ครบถ้วนสำหรับทุกภาษาที่คุณเลือก คุณจะเห็นการแจ้งเตือน "จำเป็นต้องกรอกข้อมูลในช่องนี้" (This field is required) สำหรับคำแปลที่ขาดหายไป
* ข้อความป๊อปอัป (Pop-up message): ข้อความเชิงรุกที่จะปรากฏแก่ผู้เข้าชมหลังจากเวลาที่กำหนด
  * สไตล์: เลือกระหว่าง ข้อความ (Message) (ป๊อปอัปข้อความที่ปรับแต่งได้), คำถามเปิดประเด็น (Ice-breaker) (รายการคำถามที่คลิกได้), หรือ ไม่มี (None)
  * การหน่วงเวลา (Delay): ตั้งจำนวนวินาทีก่อนที่ป๊อปอัปจะปรากฏขึ้น

> เคล็ดลับ: ใช้ 'คำถามเปิดประเด็น' เพื่อเริ่มระบบอัตโนมัติ คุณสามารถเชื่อมต่อคำถามเปิดประเด็นเข้ากับระบบอัตโนมัติที่ต้องการได้โดยใช้ตัวสร้างโฟลว์ (Flow Builder) เมื่อผู้เข้าชมคลิกที่คำถามเปิดประเด็น ระบบจะเริ่มการทำงานของโฟลว์เพื่อตอบคำถามที่พบบ่อยหรือคัดกรองลูกค้าเป้าหมายโดยอัตโนมัติ
>
> วิธีตั้งค่า:
>
> 1. ไปที่ส่วน ระบบอัตโนมัติ (Automations) > ตัวสร้างโฟลว์ (Flow Builder)
> 2. สร้างโฟลว์ใหม่และเลือกทริกเกอร์ เมื่อลูกค้าส่งข้อความ (When a customer sends a message)
> 3. ตั้งค่าช่องทางเป็น วิดเจ็ตแชท (Chat Widget)
> 4. เพิ่มเงื่อนไขเพื่อกรองตาม เนื้อหาของข้อความ (Message content)
> 5. ตั้งค่าข้อความที่ใช้กรองให้ ตรงกับคำถามเปิดประเด็นของคุณทุกตัวอักษร

* หน้าหลัก (Home screen): นี่คือมุมมองหลักของวิดเจ็ตเมื่อผู้เข้าชมเปิดขึ้นมา
  * ส่วนหัว (Header): ตั้งค่า หัวข้อ (Title) และ หัวข้อย่อย (Subtitle) (ถ้ามี)
  * การปรับแต่งปุ่มไปหน้าแชท: ปรับแต่ง หัวข้อ (Title), ข้อความเวลาตอบกลับ (Reply time message), และ ป้ายกำกับปุ่ม (Button label)
  * ช่องทางการสื่อสารอื่นๆ: คลิก + เพิ่มช่องทาง (+ Add channels) เพื่อเสนอช่องทางการติดต่ออื่นๆ เช่น Facebook, Instagram, WhatsApp, Line, อีเมล หรือหมายเลขโทรศัพท์
  * ลิงก์ภายนอก: คลิก + เพิ่มลิงก์ภายนอก (+ Add external links) เพื่อนำผู้ใช้ไปยังหน้าเพจที่เป็นประโยชน์
    * สำหรับแต่ละลิงก์ คุณต้องระบุ ป้ายกำกับลิงก์ (Link label) (ข้อความที่จะแสดง) สำหรับแต่ละภาษา และ URL ปลายทาง

**C. แท็บการตั้งค่า (Settings)**

แท็บนี้ประกอบด้วยการตั้งค่าเชิงฟังก์ชันสำหรับการเก็บข้อมูล การปรับแต่ง และการทำงานของวิดเจ็ต

* การตั้งค่าวิดเจ็ต:
  * ชื่อวิดเจ็ต: ชื่อที่จะปรากฏที่ด้านบนของวิดเจ็ตเมื่อเริ่มแชทใหม่ ชื่อนี้จะแสดงให้ลูกค้าเห็น ดังนั้นโปรดตั้งค่าให้ถูกต้อง
* การเก็บข้อมูล:
  * เปิดใช้งาน เก็บข้อมูลก่อนเริ่มแชท (Collect data before chat starts) เพื่อขอรายละเอียดการติดต่อจากผู้เข้าชม จะมีฟอร์มแสดงขึ้นมาก่อนที่พวกเขาจะสามารถส่งข้อความได้ วิธีนี้เป็นแนวทางปฏิบัติที่ดีในการขอข้อมูลติดต่อของลูกค้า เพื่อให้คุณสามารถติดต่อพวกเขากลับได้หลังจากแชทบนเว็บไซต์สิ้นสุดลง
  * หัวข้อของฟอร์ม: ปรับแต่ง หัวข้อ (Title) และ หัวข้อย่อย (Subtitle) ของฟอร์มเก็บข้อมูล
  * รายละเอียดที่ต้องการจากผู้เข้าชม: เลือกว่าจะแสดงฟิลด์ใดบ้าง (ชื่อ, อีเมล, หมายเลขโทรศัพท์) และเปิด/ปิดว่าฟิลด์นั้นๆ จำเป็น (Required) หรือไม่
  * ฟิลด์เพิ่มเติม: เพิ่มฟิลด์ที่กำหนดเองได้สูงสุด 3 ฟิลด์เพื่อเก็บข้อมูลที่เฉพาะเจาะจงมากขึ้น
    * ข้อมูลเพิ่มเติมใดๆ ที่ถูกกรอกจะถูกสร้างเป็น "โน้ต" (Note) ในส่วนข้อมูลของลูกค้า คุณสามารถใช้ส่วนนี้ถามคำถามเพื่อคัดกรองเพิ่มเติมได้ เช่น "หมายเลขสมาชิกของคุณคืออะไร?" หรือ "คุณทำการสั่งซื้อไปแล้วกี่ครั้ง?" เพื่อรวบรวมข้อมูลเพิ่มเติม
* การปรับแต่งเพิ่มเติม:
  * แสดงหน้าหลัก: หากปิดตัวเลือกนี้ ผู้เข้าชมจะเข้าสู่หน้าแชทสนทนาโดยตรง แทนที่จะเห็นหน้าหลักก่อน
  * ปิดใช้งานแชทวิดเจ็ตบนมือถือ: เปิดใช้งานเพื่อซ่อนวิดเจ็ตจากผู้เข้าชมบนอุปกรณ์มือถือ
  * ซ่อน "Powered by Zaapi" บนวิดเจ็ต: ลบการแสดงแบรนด์ของ Zaapi (ฟีเจอร์นี้มีให้ใช้เฉพาะในแผน Advanced เท่านั้น)
* รูปโปรไฟล์ในแชท (Chat avatar):
  * เลือกว่าจะให้ลูกค้าเห็นรูปภาพใดในส่วนหัวของแชท
  * แสดงโลโก้: แสดงโลโก้ธุรกิจของคุณตลอดเวลา
  * แสดงเจ้าหน้าที่: แสดงรูปโปรไฟล์ของเจ้าหน้าที่ที่กำลังดูแลการสนทนา

***

#### 3. **การติดตั้งวิดเจ็ตบนเว็บไซต์ของคุณ**

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

1. ไปที่แท็บ การติดตั้ง (Install)
2. ใต้หัวข้อ "1. คัดลอกโค้ดนี้" ให้คลิกปุ่ม คัดลอกโค้ด (Copy code) ระบบจะคัดลอกโค้ด JavaScript ที่เป็นเอกลักษณ์สำหรับวิดเจ็ตของคุณ
3. นำโค้ดที่คัดลอกไปวางในซอร์สโค้ด HTML ของเว็บไซต์ของคุณ ก่อนแท็กปิด `</body>` วิธีนี้จะช่วยให้วิดเจ็ตโหลดบนทุกหน้าของเว็บไซต์คุณ
4. เผยแพร่การเปลี่ยนแปลงบนเว็บไซต์ของคุณ ตอนนี้วิดเจ็ตแชทควรจะแสดงผลแล้ว!

> ต้องการความช่วยเหลือ? สำหรับคำแนะนำโดยละเอียดเฉพาะแต่ละแพลตฟอร์ม โปรดใช้คู่มือแนะนำทีละขั้นตอนที่ลิงก์ไว้ด้านล่างของหน้า การติดตั้ง สำหรับบริการต่างๆ เช่น Shopify, WordPress, Webflow และอื่นๆ