Cara Menambah Chatbot AI Asyntai ke Craft CMS

Panduan langkah demi langkah untuk laman web Craft CMS

Dapatkan Kod Benam

Langkah 1: Dapatkan Kod Benam Anda

Pertama, pergi ke Papan Pemuka Asyntai anda dan tatal ke bawah ke bahagian "Kod Benam". Salin kod benam unik anda yang akan kelihatan seperti ini:

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

Nota: Kod di atas hanyalah contoh. Anda mesti menyalin kod benam unik anda sendiri dari Papan Pemuka anda kerana ia mengandungi ID widget peribadi anda.

Langkah 2: Edit Templat Susun Atur Anda (Disyorkan)

Cara paling mudah untuk menambah chatbot ke semua halaman ialah dengan mengedit templat susun atur utama anda:

  1. Akses fail projek Craft CMS anda melalui FTP, SSH, atau editor kod anda
  2. Navigasi ke direktori templates/
  3. Cari fail susun atur utama anda (biasanya dinamakan _layout.twig, _layout.html, atau terletak dalam templates/_layouts/)
  4. Cari tag penutup </body>
  5. Tampal kod benam Asyntai anda sejurus sebelum tag </body>
  6. Simpan fail

Petua: Menambah skrip sebelum tag penutup </body> memastikan ia dimuatkan selepas kandungan halaman, yang disyorkan untuk widget sembang dan tidak akan melambatkan pemuatan halaman anda.

Alternative: Using Twig {% js %} Tag (Craft CMS 3.x+)

Craft CMS menyediakan tag Twig terbina dalam untuk mendaftarkan JavaScript:

  1. Buka templat susun atur utama anda
  2. Tambah kod berikut sebelum tag penutup </body>:
    {% js %} (function() { var script = document.createElement('script'); script.async = true; script.src = 'https://asyntai.com/static/js/chat-widget.js'; script.setAttribute('data-asyntai-id', 'YOUR_WIDGET_ID'); document.body.appendChild(script); })(); {% endjs %}
  3. Gantikan YOUR_WIDGET_ID dengan ID widget sebenar anda
  4. Simpan fail

Nota: The {% js %} tag automatically handles script registration and prevents duplicate loading if the same code appears multiple times.

Alternatif: Buat Fail Sertaan Berasingan

Untuk organisasi yang lebih baik, buat fail sertaan khusus:

  1. Buat fail baharu: templates/_includes/chatbot.twig (atau .html)
  2. Tambah kod benam Asyntai anda ke fail ini:
    <script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>
  3. Dalam templat susun atur utama anda, sertakan fail ini sebelum </body>:
    {% include '_includes/chatbot' %}
  4. Simpan kedua-dua fail

Petua: Menggunakan fail sertaan memudahkan anda mengaktifkan/menyahaktifkan chatbot di seluruh laman anda dengan mengomentari satu baris sahaja.

Alternatif: Pemuatan Bersyarat

Untuk memuatkan chatbot hanya pada halaman atau bahagian tertentu:

  1. Dalam templat susun atur atau halaman anda, gunakan syarat Twig:
    {% if entry.showChatbot ?? true %} <script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script> {% endif %}
  2. Atau semak bahagian tertentu:
    {% if craft.app.request.segments[0] != 'admin' %} <script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script> {% endif %}

Langkah 3: Sahkan Pemasangan

Selepas menyimpan perubahan anda, lawati laman web Craft CMS anda dalam tab pelayar baharu atau tetingkap inkognito. Anda sepatutnya melihat butang widget sembang di sudut kanan bawah. Klik untuk memastikan ia terbuka dan berfungsi dengan betul.

Tidak nampak widget? Pastikan anda menyimpan fail templat dan anda mengedit templat susun atur yang betul yang digunakan oleh halaman anda. Kosongkan cache pelayar anda atau lihat dalam tetingkap inkognito. Jika menggunakan caching templat, kosongkan cache Craft CMS dari Panel Kawalan di bawah Utilities > Clear Caches.

Lokasi Templat: Lokasi templat Craft CMS mungkin berbeza bergantung pada persediaan projek anda. Lokasi biasa termasuk templates/_layout.twig, templates/_layouts/main.twig, atau templates/_base.twig. Semak templat sedia ada anda untuk mencari di mana tag </body> ditakrifkan.