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

แพลตฟอร์ม:

Drupal

HTML/Custom WordPress Shopify WooCommerce BigCommerce Ecwid Wix Squarespace Webflow Weebly HubSpot Tilda Adobe Experience Manager Duda Google Sites Bludit Plesk Concrete CMS Craft CMS Contentful Docusaurus Strapi Joomla Kentico Drupal Magento Blogger Bitrix TYPO3 PrestaShop OpenCart Ghost Hugo Statamic Umbraco Volusion Moodle SilverStripe Grav October CMS ProcessWire Sanity ExpressionEngine Sylius Backdrop CMS MODX Bagisto PayloadCMS e107 CrafterCMS Kirby MedusaCMS DatoCMS GoDaddy Framer Bubble Carrd Jimdo Strikingly Kajabi Teachable Thinkific ClickFunnels Hostinger Unbounce Leadpages Systeme.io Instapage

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

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

ขั้นตอนที่ 2: การใช้โมดูล Header and Footer Scripts (แนะนำ)

วิธีที่ง่ายที่สุดในการเพิ่มแชทบอทคือใช้โมดูล "Header and Footer Scripts":

1. เข้าสู่ระบบแผงผู้ดูแลระบบ Drupal ของคุณ
2. ไปที่ Extend และคลิก "Install new module"
3. ค้นหา "Header and Footer Scripts" หรือดาวน์โหลดจาก Drupal.org
4. ติดตั้งและเปิดใช้งานโมดูล
5. ไปที่ Configuration → Development → Header and Footer Scripts
6. คลิกที่แท็บ "Footer"
7. วางโค้ดฝัง Asyntai ของคุณในพื้นที่ข้อความสคริปต์ footer
8. คลิก "Save configuration"

ทางเลือก: แก้ไขเทมเพลตธีม

คุณสามารถเพิ่มโค้ดลงในไฟล์เทมเพลตธีมของคุณโดยตรง:

1. ไปที่โฟลเดอร์ธีมของคุณ: themes/your_theme/
2. เปิดไฟล์ html.html.twig (หรือสร้างใหม่ถ้ายังไม่มี)
3. ค้นหาแท็กปิด </body>
4. วางโค้ดฝังตัว Asyntai ของคุณก่อนแท็ก </body>
5. บันทึกไฟล์
6. ล้างแคชของ Drupal: Configuration → Performance → Clear all caches

ทางเลือก: การใช้ Libraries (สำหรับนักพัฒนา)

สำหรับนักพัฒนาที่ต้องการใช้ระบบ asset library ของ Drupal:

1. สร้างหรือแก้ไขไฟล์ *.libraries.yml ของธีมคุณ
2. เพิ่มรายการ library ใหม่:
   asyntai-chatbot:
js:
https://asyntai.com/static/js/chat-widget.js: { type: external, attributes: { async: true, data-asyntai-id: YOUR_WIDGET_ID } }
3. แนบ library ในไฟล์ *.info.yml ของธีมคุณ:
   libraries:
- your_theme/asyntai-chatbot
4. ล้างแคชของ Drupal

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

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