Cara Menambahkan Chatbot AI Asyntai ke Backdrop CMS

Panduan langkah demi langkah untuk situs web Backdrop CMS

Platform:

Langkah 1: Dapatkan Kode Embed Anda

Pertama, buka Dasbor Asyntai dan gulir ke bawah ke bagian "Kode Embed". Salin kode embed unik Anda yang akan terlihat seperti ini:

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

Catatan: Kode di atas hanya contoh. Anda harus menyalin kode embed unik Anda sendiri dari Dasbor karena berisi ID widget personal Anda.

Langkah 2: Tambahkan ke Templat Tema (Disarankan)

Backdrop CMS menggunakan file templat .tpl.php di temanya. Pendekatan yang disarankan adalah menambahkan kode embed langsung ke templat halaman tema aktif Anda:

Akses instalasi Backdrop CMS Anda melalui FTP atau File Manager
Navigasi ke direktori tema aktif Anda: themes/yourtheme/
Buka file page.tpl.php (atau layout.tpl.php tergantung tema Anda)
Temukan tag penutup </body> atau baris <?php print $page_bottom; ?>
Tempel kode embed Asyntai Anda tepat sebelum baris tersebut
Simpan file

<!-- Asyntai AI Chatbot -->
<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>
<?php print $page_bottom; ?>
</body>

Tip: Menempatkan kode tepat sebelum <?php print $page_bottom; ?> atau tag penutup </body> memastikan chatbot dimuat setelah konten halaman, memberikan performa muat halaman yang lebih baik. Metode ini secara otomatis menambahkan chatbot ke setiap halaman yang menggunakan tema ini.

Metode Alternatif 1: Menggunakan Modul Kustom

Anda dapat membuat modul Backdrop CMS sederhana yang menyuntikkan skrip chatbot menggunakan backdrop_add_js():

Buat direktori modul: modules/custom/asyntai_widget/
Buat file modul asyntai_widget.module dengan kode berikut:
// modules/custom/asyntai_widget/asyntai_widget.module function asyntai_widget_init() { backdrop_add_js('https://asyntai.com/static/js/chat-widget.js', array( 'type' => 'external', 'scope' => 'footer', 'attributes' => array('async' => 'async', 'data-asyntai-id' => 'YOUR_WIDGET_ID'), )); }
Buat file asyntai_widget.info:
name = Asyntai AI Chatbot Widget description = Adds the Asyntai AI chatbot widget to all pages. backdrop = 1.x package = Custom type = module
Buka Functionality (admin/modules) di panel admin Backdrop Anda
Temukan "Asyntai AI Chatbot Widget" di bawah paket Custom dan aktifkan
Klik "Save configuration"

Catatan: Ganti YOUR_WIDGET_ID di kode modul dengan ID widget Anda yang sebenarnya dari Dasbor Asyntai. Pendekatan modul kustom aman terhadap pembaruan dan tidak akan ditimpa saat memperbarui tema Anda.

Metode Alternatif 2: Menggunakan Modul "Add to Head" Backdrop

Modul kontribusi "Add to Head" menyediakan cara mudah untuk menyuntikkan skrip tanpa mengedit kode:

Unduh dan instal modul kontribusi "Add to Head" dari situs web Backdrop CMS
Buka Configuration > Development > Add to Head
Tambahkan kode embed Asyntai Anda di bagian footer
Klik "Save configuration"

Tip: Menggunakan modul "Add to Head" adalah metode termudah jika Anda tidak ingin mengedit file tema atau membuat modul kustom. Modul ini menyediakan antarmuka admin sederhana untuk mengelola skrip yang disuntikkan.

Metode Alternatif 3: Menggunakan Sistem Blok

Sistem tata letak dan blok Backdrop CMS juga dapat digunakan untuk menambahkan chatbot:

Masuk ke panel admin Backdrop CMS Anda
Buka Structure > Layouts
Pilih tata letak yang ingin Anda edit (misalnya, tata letak default)
Klik "Add block" di area footer
Pilih "Custom block"
Atur format blok ke "Full HTML" atau "Raw HTML"
Tempel kode embed Asyntai Anda ke isi blok
Beri judul blok (misalnya, "Asyntai Chatbot") dan secara opsional centang "Hide title"
Klik "Save block" lalu "Save layout"

Penting: Pastikan format teks diatur ke "Full HTML" atau "Raw HTML" agar tag skrip tidak dihapus. Format "Filtered HTML" default akan menghapus tag skrip untuk alasan keamanan.

Langkah 3: Bersihkan Cache dan Verifikasi

Setelah melakukan perubahan, bersihkan cache Backdrop CMS dan verifikasi instalasi:

Buka Configuration > Performance di panel admin Anda
Klik "Clear all caches"
Buka situs web Anda di tab browser baru atau jendela penyamaran
Anda seharusnya melihat tombol widget obrolan di pojok kanan bawah
Klik untuk memastikan widget terbuka dan berfungsi dengan benar

Tidak melihat widget? Pastikan Anda telah membersihkan cache Backdrop CMS di Configuration > Performance. Coba lihat situs Anda di jendela penyamaran atau bersihkan cache browser Anda. Buka konsol browser (F12) untuk memeriksa error JavaScript. Jika Anda menggunakan metode modul kustom, verifikasi bahwa modul telah diaktifkan di bawah Functionality.