Cara Menambah Chatbot AI Asyntai ke October CMS

Panduan langkah demi langkah untuk laman web October 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: Tambah ke Templat Layout (Disyorkan)

Cara yang disyorkan untuk menambah chatbot adalah dengan mengedit layout lalai anda dalam backend October CMS:

  1. Log masuk ke backend October CMS anda
  2. Pergi ke CMS > Layouts dalam menu utama
  3. Buka layout lalai anda (biasanya default.htm)
  4. Cari tag penutup </body> tag dan {% scripts %} placeholder
  5. Tambah kod benam Asyntai anda sejurus sebelum {% scripts %} dan </body>:
    <script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script> {% scripts %} </body>
  6. Klik "Save" untuk menerapkan perubahan anda

Petua: Placing the script before {% scripts %} and </body> ensures it loads after the page content, which is recommended for chat widgets and won't slow down your page loading.

Alternative Method 1: Using {% put scripts %} Block

Anda boleh menggunakan placeholder skrip October CMS untuk menyuntik chatbot dari halaman atau partial:

  1. Buka mana-mana halaman atau partial dalam editor CMS
  2. Tambah kod berikut menggunakan {% put scripts %} blok:
    {% put scripts %} <script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script> {% endput %}
  3. Gantikan YOUR_WIDGET_ID dengan ID widget sebenar anda dari papan pemuka
  4. Klik "Save"

Nota: For this method to work, your layout must include the {% scripts %} placeholder in its markup. This is where October CMS renders all injected scripts. Most default layouts already include this tag.

Kaedah Alternatif 2: Menggunakan Komponen PHP

Jika anda lebih suka pendekatan programatik, anda boleh menambah skrip chatbot melalui komponen tersuai:

  1. Cipta atau ubah suai komponen dalam plugin October CMS anda
  2. Dalam kaedah onRun() komponen, gunakan kaedah addJs():
    public function onRun() { $this->addJs('https://asyntai.com/static/js/chat-widget.js', [ 'async' => true, 'data-asyntai-id' => 'YOUR_WIDGET_ID' ]); }
  3. Gantikan YOUR_WIDGET_ID dengan ID widget sebenar anda
  4. Daftarkan komponen pada halaman di mana anda mahu chatbot muncul

Petua: Menggunakan komponen memberikan anda kawalan programatik ke atas bila dan di mana chatbot dimuatkan. Anda boleh menambah logik bersyarat dalam onRun() untuk mengawal pemuatan berdasarkan peranan pengguna, jenis halaman, atau kriteria lain.

Kaedah Alternatif 3: Menggunakan Partial

Anda boleh mencipta partial boleh guna semula untuk widget chatbot:

  1. Pergi ke CMS > Partials dalam backend October CMS
  2. Klik "+ Add" untuk mencipta partial baharu
  3. Namakannya asyntai-widget.htm
  4. Tambah kod benam Asyntai anda ke partial:
    <script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>
  5. Klik "Save"
  6. Buka templat layout anda dan sertakan partial sebelum </body>:
    {% partial 'asyntai-widget' %}
  7. Simpan layout

Petua: Menggunakan partial memudahkan untuk mengaktifkan atau menyahaktifkan chatbot di seluruh laman anda dengan hanya menambah atau membuang penyertaan partial dari layout anda.

Langkah 3: Sahkan Pemasangan

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

Tidak nampak widget? Pastikan anda telah menyimpan semua perubahan dalam backend CMS. Kosongkan cache pelayar anda atau lihat dalam tetingkap inkognito. Jika laman anda menggunakan caching, kosongkan cache October CMS dengan menjalankan php artisan cache:clear dari baris arahan, atau gunakan pilihan Settings > System > Clear Cache dalam backend.

Pemilihan Layout: Pastikan halaman di mana anda mahu chatbot muncul menggunakan layout yang betul. Anda boleh menyemak layout yang digunakan oleh sesebuah halaman dengan membuka halaman tersebut dalam CMS > Pages dan melihat dropdown Layout dalam tetapan halaman.