Cara Menambahkan Chatbot AI Asyntai ke e107

Panduan langkah demi langkah untuk situs web CMS e107

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)

Cara yang disarankan untuk menambahkan chatbot adalah dengan mengedit file template tema e107 Anda secara langsung:

Navigasi ke folder tema e107 Anda: e107_themes/yourtheme/
Buka file template utama tema (biasanya theme.php atau theme.html)
Temukan tag penutup </body>
Tempelkan kode embed Asyntai Anda tepat sebelum tag </body>:

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

Tip: Jika tema Anda menggunakan theme.php, cari bagian di mana HTML footer dirender. Kode embed harus ditempatkan setelah semua konten lain tetapi sebelum tag body penutup.

Metode Alternatif 1: Menggunakan Header/Footer Kustom e107

Anda dapat menambahkan skrip chatbot melalui panel admin e107 tanpa mengedit file tema:

Masuk ke panel admin e107 Anda
Buka Admin > Preferences > Site Preferences
Cari bagian "Custom Footer" atau "Footer Scripts"
Tempelkan kode embed Asyntai Anda ke area teks skrip footer
Klik "Save" untuk menerapkan perubahan

Catatan: Metode ini paling mudah jika Anda ingin menghindari pengeditan file tema secara langsung. Skrip akan disertakan di setiap halaman situs e107 Anda secara otomatis.

Metode Alternatif 2: Menggunakan Plugin e107

Untuk pendekatan yang lebih modular, Anda dapat membuat plugin sederhana atau menggunakan sistem hook plugin untuk menyuntikkan skrip chatbot:

Buat plugin sederhana atau gunakan plugin "Custom Pages"
Tambahkan skrip melalui sistem hook plugin e107 dengan membuat file e_footer.php di direktori plugin Anda
Di dalam e_footer.php, keluarkan kode embed Anda:

<?php
// e_footer.php - Asyntai Chatbot Plugin Hook
echo '<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>';
?>

Tip: Pendekatan hook plugin menjaga integrasi chatbot Anda terpisah dari tema, sehingga akan tetap ada meskipun Anda mengganti tema.

Metode Alternatif 3: Menggunakan Sistem Menu e107

Anda dapat menggunakan sistem Menu bawaan e107 untuk menambahkan skrip chatbot ke area footer:

Masuk ke panel admin e107 Anda
Buka Admin > Menus
Buat menu HTML kustom
Tempelkan kode embed Asyntai Anda ke konten menu
Tetapkan menu ke area footer template Anda
Simpan konfigurasi menu

Penting: Saat menggunakan sistem Menu, pastikan area menu yang Anda tetapkan mendukung output HTML/skrip mentah. Beberapa area menu mungkin menghapus tag skrip untuk keamanan. Jika skrip dihapus, gunakan salah satu metode lain sebagai gantinya.

Langkah 3: Verifikasi Instalasi

Setelah menyimpan perubahan Anda, kunjungi situs web e107 Anda di tab browser baru atau jendela penyamaran. Anda akan melihat tombol widget obrolan di pojok kanan bawah. Klik untuk memastikan widget terbuka dan berfungsi dengan benar.

Tidak melihat widget? Coba bersihkan cache e107 Anda dari panel admin di bawah Admin > Cache. Coba juga membersihkan cache browser Anda atau melihat di jendela penyamaran. Pastikan kode embed Anda ditempatkan dengan benar dan berisi ID widget unik Anda dari Dashboard.