Cara Menambahkan Chatbot AI Asyntai ke Moodle

Panduan langkah demi langkah untuk situs web Moodle LMS

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: Menggunakan HTML Tambahan (Direkomendasikan)

Moodle memiliki fitur bawaan untuk menambahkan HTML/JavaScript kustom ke semua halaman:

Masuk ke situs Moodle Anda sebagai administrator
Buka Site administration
Navigasi ke Appearance → Additional HTML
Gulir ke bawah ke bagian "Before BODY is closed"
Tempelkan kode embed Asyntai Anda di area teks
Klik "Save changes"

Tips: Menambahkan kode ke "Before BODY is closed" menempatkannya tepat sebelum tag penutup </body>, yang merupakan penempatan yang direkomendasikan untuk widget chat dan memastikan kode dimuat setelah konten halaman utama.

Alternatif: Menggunakan Pengaturan Tema

Banyak tema Moodle (termasuk Boost dan variannya) memiliki pengaturan sendiri untuk menambahkan JavaScript kustom:

Buka Site administration → Appearance → Themes
Klik pada Theme settings untuk tema aktif Anda (misalnya, Boost)
Cari bagian "Raw SCSS", "Additional HTML", atau "Custom JavaScript"
Jika ada kolom JavaScript, tempel kode embed Asyntai Anda di sana
Klik "Save changes"
Bersihkan cache: Site administration → Development → Purge caches

Catatan: Pengaturan khusus tema bervariasi antar tema. Jika tema Anda tidak memiliki kolom JavaScript, gunakan metode HTML Tambahan di atas.

Alternatif: Membuat Plugin Lokal

Untuk kontrol lebih, Anda dapat membuat plugin lokal sederhana:

Buat struktur folder: local/asyntaichatbot/ di instalasi Moodle Anda
Buat version.php:
<?php defined('MOODLE_INTERNAL') || die(); $plugin->component = 'local_asyntaichatbot'; $plugin->version = 2024010100; $plugin->requires = 2022041900;
Buat lib.php:
<?php defined('MOODLE_INTERNAL') || die(); function local_asyntaichatbot_before_footer() { global $PAGE; $PAGE->requires->js_call_amd('local_asyntaichatbot/loader', 'init'); }
Buat folder amd/src/ dan file loader.js:
define([], function() { return { init: 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); } }; });
Ganti YOUR_WIDGET_ID dengan ID widget Anda yang sebenarnya
Buka Site administration → Notifications untuk menginstal plugin
Bersihkan cache setelah instalasi

Penting: Metode plugin lokal memerlukan akses baris perintah untuk membuat file. Untuk sebagian besar pengguna, metode HTML Tambahan lebih sederhana dan memadai.

Alternatif: Edit Template Footer Tema

Anda juga dapat mengedit template footer tema Anda secara langsung:

Navigasi ke folder tema Anda: theme/YOUR_THEME/
Temukan file layout (misalnya, layout/columns2.php atau templates/columns2.mustache)
Temukan tag penutup </body> atau bagian footer
Tambahkan kode embed Asyntai Anda tepat sebelum </body>
Simpan file
Bersihkan cache Moodle

Penting: Mengedit file tema secara langsung berarti perubahan mungkin hilang saat memperbarui tema Anda. Gunakan child theme atau metode HTML Tambahan untuk solusi yang lebih permanen.

Langkah 3: Verifikasi Instalasi

Setelah menyimpan perubahan dan membersihkan cache, kunjungi situs Moodle Anda di tab browser baru atau jendela penyamaran. Anda seharusnya melihat tombol widget chat di pojok kanan bawah. Klik untuk memastikan widget terbuka dan berfungsi dengan benar.

Tidak melihat widget? Pastikan untuk membersihkan semua cache Moodle: buka Site administration → Development → Purge all caches. Coba juga bersihkan cache browser Anda atau lihat di jendela penyamaran. Jika Anda menggunakan plugin caching atau reverse proxy, bersihkan cache tersebut juga.