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

คู่มือทีละขั้นตอนสำหรับ Google Sites

แพลตฟอร์ม:

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

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

<script>(function(){var l=function(){var s=document.createElement("script");s.src="https://widget.asyntai.com/static/js/chat-widget.js";s.async=true;s.setAttribute("data-asyntai-id","YOUR_WIDGET_ID");document.head.appendChild(s)};if(document.readyState==="complete"){l()}else{window.addEventListener("load",l)}})();</script>

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

ขั้นตอนที่ 2: เพิ่มโค้ดโดยใช้ฟีเจอร์ Embed

Google Sites ใช้ฟีเจอร์ embed เพื่อเพิ่มโค้ด HTML และ JavaScript แบบกำหนดเอง:

บนคอมพิวเตอร์ เปิดเว็บไซต์ของคุณใน Google Sites
ไปที่หน้าที่คุณต้องการเพิ่มแชทบอท
คลิก "Insert" ในแถบด้านข้างขวา (หรือจากเมนูด้านบน)
เลือก "Embed" จากตัวเลือก
คลิกแท็บ "Embed code" ที่ด้านบน
วางโค้ดฝัง Asyntai ของคุณลงในกล่องข้อความ
คลิก "Next" เพื่อดูตัวอย่างว่าจะมีหน้าตาอย่างไร
คลิก "Insert" เพื่อเพิ่มโค้ดลงในหน้าของคุณ
คลิก "Publish" ที่มุมขวาบนเพื่อให้การเปลี่ยนแปลงของคุณใช้งานจริง

เคล็ดลับ: Google Sites ครอบ embed ด้วย iframe ดังนั้นแชทบอทจะปรากฏภายในพื้นที่ embed แทนที่จะยึดกับมุมเบราว์เซอร์ เพื่อประสบการณ์ที่ดีที่สุด ให้วางองค์ประกอบ embed ที่ด้านล่างสุดของเนื้อหาหน้าเว็บเพื่อให้ปุ่มแชทบอทหาง่าย

การเพิ่มในหลายหน้า

เพื่อเพิ่มแชทบอทในหลายหน้าบน Google Site ของคุณ:

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

หมายเหตุ: ต่างจากแพลตฟอร์มอื่นบางอย่าง Google Sites ไม่มีจุดแทรกโค้ด "ทั่วทั้งเว็บไซต์" เพียงจุดเดียว คุณจะต้องเพิ่มโค้ด embed ในแต่ละหน้าที่คุณต้องการให้แชทบอทปรากฏ หรือใช้ header/footer แบบกำหนดเองหากธีมของคุณรองรับ

วิธีที่ Google Sites จัดการกับโค้ดที่ฝัง

ทำความเข้าใจวิธีที่ Google Sites ประมวลผลโค้ดของคุณ:

Google Sites ครอบโค้ดของคุณในองค์ประกอบ <iframe> ในสภาพแวดล้อมแบบ sandbox
JavaScript ต้องอยู่ภายในแท็ก <script> (ซึ่งโค้ด Asyntai ของคุณรวมไว้แล้ว)
คุณสามารถอ้างอิงไฟล์ JavaScript ภายนอก (เช่น วิดเจ็ต Asyntai)
ฟีเจอร์ embed มีข้อจำกัดน้อยกว่า HTML Box ของ Google Sites แบบคลาสสิก
โค้ดที่ฝังจะไม่ถูกจัดทำดัชนีในการค้นหาเว็บไซต์

สำคัญ: เนื่องจากการ sandbox ด้วย iframe ของ Google Sites ฟีเจอร์ขั้นสูงบางอย่างอาจทำงานแตกต่างจากเว็บไซต์แบบดั้งเดิม แชทบอท Asyntai ถูกออกแบบให้ทำงานภายในข้อจำกัดเหล่านี้

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

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