วิธีเพิ่มแชทบอท AI Asyntai ลงใน WordPress

คู่มือทีละขั้นตอนสำหรับเว็บไซต์ WordPress

แพลตฟอร์ม:

ขั้นตอนที่ 1: รับโค้ดฝังตัวของคุณ

ก่อนอื่น ไปที่แดชบอร์ด Asyntai ของคุณและเลื่อนลงไปที่ส่วน "Embed Code" คัดลอกโค้ดฝังตัวเฉพาะของคุณซึ่งจะมีลักษณะดังนี้:

<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>

หมายเหตุ: โค้ดด้านบนเป็นเพียงตัวอย่าง คุณต้องคัดลอกโค้ดฝังตัวเฉพาะของคุณจากแดชบอร์ดเนื่องจากมี widget ID ส่วนตัวของคุณ

ขั้นตอนที่ 2: เลือกวิธีการติดตั้ง

มีหลายวิธีในการเพิ่มวิดเจ็ตแชทลงใน WordPress เลือกวิธีที่เหมาะกับคุณมากที่สุด:

วิธีที่ 1: ใช้ปลั๊กอิน (แนะนำ)

วิธีที่ง่ายที่สุดในการเพิ่มวิดเจ็ตแชทคือการใช้ปลั๊กอิน เช่น "Insert Headers and Footers" หรือ "WPCode"

ใช้ WPCode (ฟรี)

ไปที่ Plugins → Add New ในแผงควบคุม WordPress ของคุณ
ค้นหา "WPCode" และติดตั้ง
เปิดใช้งานปลั๊กอิน
ไปที่ Code Snippets → Header & Footer
วางโค้ดฝังของ Asyntai ในส่วน "Footer"
คลิก "Save Changes"

ใช้ Insert Headers and Footers

ไปที่ Plugins → Add New ในแผงควบคุม WordPress ของคุณ
ค้นหา "Insert Headers and Footers" โดย WPBeginner
ติดตั้งและเปิดใช้งานปลั๊กอิน
ไปที่ Settings → Insert Headers and Footers
วางโค้ดฝังของ Asyntai ในกล่อง "Scripts in Footer"
คลิก "Save"

ทำไมต้องใช้ปลั๊กอิน? การใช้ปลั๊กอินช่วยให้โค้ดของคุณคงอยู่แม้ว่าคุณจะอัปเดตหรือเปลี่ยนธีม WordPress

วิธีที่ 2: แก้ไขไฟล์ธีม

คุณสามารถเพิ่มโค้ดลงในไฟล์ธีมของคุณโดยตรง ตำแหน่งของ Theme File Editor ขึ้นอยู่กับเวอร์ชัน WordPress และประเภทธีมของคุณ

สำหรับธีมคลาสสิก

ไปที่ Appearance → Theme File Editor ในแผงควบคุม WordPress ของคุณ
เลือกธีมที่ใช้งานอยู่จากเมนูแบบเลื่อนลง (หากยังไม่ได้เลือก)
ค้นหาและคลิกที่ footer.php ในรายการไฟล์ด้านขวา
เลื่อนลงด้านล่างและค้นหาแท็กปิด </body>
วางโค้ดฝังตัว Asyntai ของคุณก่อนแท็ก </body>
คลิก "Update File"

สำหรับธีมบล็อก (ธีม FSE)

หากคุณใช้ธีมแบบบล็อก (เช่น Twenty Twenty-Four หรือธีม Full Site Editing อื่นๆ) Theme File Editor ได้ย้ายไปแล้ว:

ไปที่ Tools → Theme File Editor ในแผงควบคุม WordPress ของคุณ
เลือกธีมที่ใช้งานอยู่จากเมนูแบบเลื่อนลง
ค้นหา footer.php หรือ footer.html ในรายการไฟล์
เพิ่มโค้ดฝังของ Asyntai ก่อนแท็กปิด </body>
คลิก "Update File"

หมายเหตุ: ธีมบล็อกบางตัวไม่มีไฟล์ footer.php ในกรณีนั้น ให้ใช้วิธีปลั๊กอิน (WPCode) ซึ่งใช้ได้กับธีมทุกประเภท

สำคัญ: การอัปเดตธีมจะเขียนทับการเปลี่ยนแปลงของคุณ สำหรับวิธีแก้ปัญหาถาวร ให้ใช้ธีมย่อยหรือวิธีปลั๊กอินแทน

วิธีที่ 3: ใช้ Elementor

หากคุณใช้ Elementor คุณสามารถเพิ่มโค้ดผ่านฟีเจอร์โค้ดกำหนดเองของ Elementor

Elementor Pro

ไปที่ Elementor → Custom Code
คลิก "Add New"
ตั้งชื่อ เช่น "Asyntai Chatbot\
ตั้งค่า Location เป็น "Before </body> End"
วางโค้ดฝังตัว Asyntai ของคุณ
ตั้งค่า Display Conditions เป็น "Entire Site"
คลิก "Publish"

Elementor Free

หากคุณใช้ Elementor เวอร์ชันฟรี ให้ใช้วิธีปลั๊กอินที่อธิบายไว้ด้านบน เนื่องจากการเพิ่มโค้ดกำหนดเองต้องใช้ Elementor Pro

ขั้นตอนที่ 3: ยืนยันการติดตั้ง

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

ไม่เห็นวิดเจ็ต? ล้างแคชเบราว์เซอร์และปลั๊กอินแคช WordPress ทั้งหมด หากคุณใช้ปลั๊กอินแคช เช่น WP Rocket หรือ W3 Total Cache ให้ล้างแคชหลังจากเพิ่มโค้ด

เอกสาร