Cara Menambahkan Chatbot AI Asyntai ke WordPress

Panduan langkah demi langkah untuk website WordPress

Dapatkan Kode Embed

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: Pilih Metode Instalasi

Ada beberapa cara untuk menambahkan widget chat ke WordPress. Pilih metode yang paling sesuai untuk Anda:

Metode 1: Menggunakan Plugin (Direkomendasikan)

Cara termudah untuk menambahkan widget chat adalah menggunakan plugin seperti "Insert Headers and Footers" atau "WPCode".

Menggunakan WPCode (Gratis)

  1. Buka Plugins → Add New di admin WordPress Anda
  2. Cari "WPCode" dan instal
  3. Aktifkan plugin
  4. Buka Code Snippets → Header & Footer
  5. Tempel kode embed Asyntai Anda di bagian "Footer"
  6. Klik "Save Changes"

Menggunakan Insert Headers and Footers

  1. Buka Plugins → Add New di admin WordPress Anda
  2. Cari "Insert Headers and Footers" oleh WPBeginner
  3. Instal dan aktifkan plugin
  4. Buka Settings → Insert Headers and Footers
  5. Tempel kode embed Asyntai Anda di kotak "Scripts in Footer"
  6. Klik "Save"

Mengapa menggunakan plugin? Menggunakan plugin memastikan kode Anda tetap ada meskipun Anda memperbarui atau mengganti tema WordPress.

Metode 2: Edit File Tema

Anda dapat menambahkan kode langsung ke file tema Anda. Lokasi Theme File Editor tergantung pada versi WordPress dan tipe tema Anda.

Untuk Tema Klasik

  1. Buka Appearance → Theme File Editor di admin WordPress Anda
  2. Pilih tema aktif Anda dari dropdown (jika belum dipilih)
  3. Temukan dan klik footer.php di daftar file di sebelah kanan
  4. Gulir ke bawah dan temukan tag penutup </body>
  5. Tempel kode embed Asyntai Anda tepat sebelum tag </body>
  6. Klik "Update File"

Untuk Tema Blok (Tema FSE)

Jika Anda menggunakan tema berbasis blok (seperti Twenty Twenty-Four atau tema Full Site Editing lainnya), Theme File Editor telah dipindahkan:

  1. Buka Tools → Theme File Editor di admin WordPress Anda
  2. Pilih tema aktif Anda dari dropdown
  3. Cari footer.php atau footer.html di daftar file
  4. Tambahkan kode embed Asyntai Anda sebelum tag penutup </body>
  5. Klik "Update File"

Catatan: Beberapa tema blok tidak memiliki file footer.php. Dalam hal ini, gunakan metode plugin (WPCode) yang berfungsi dengan semua tipe tema.

Penting: Pembaruan tema akan menimpa perubahan Anda. Untuk solusi permanen, gunakan child theme atau metode plugin sebagai gantinya.

Metode 3: Menggunakan Elementor

Jika Anda menggunakan Elementor, Anda dapat menambahkan kode melalui fitur custom code Elementor.

Elementor Pro

  1. Buka Elementor → Custom Code
  2. Klik "Add New"
  3. Beri nama seperti "Asyntai Chatbot\
  4. Atur Location ke "Before </body> End"
  5. Tempel kode embed Asyntai Anda
  6. Atur Display Conditions ke "Entire Site"
  7. Klik "Publish"

Elementor Free

Jika Anda menggunakan versi gratis Elementor, gunakan metode plugin yang dijelaskan di atas, karena injeksi custom code memerlukan Elementor Pro.

Langkah 3: Verifikasi Instalasi

Setelah menambahkan kode, kunjungi website Anda di tab browser baru atau jendela incognito. Anda akan melihat tombol widget chat di pojok kanan bawah situs Anda. Klik untuk memastikan widget terbuka dan berfungsi dengan benar.

Tidak melihat widget? Bersihkan cache browser dan plugin caching WordPress apa pun. Jika Anda menggunakan plugin caching seperti WP Rocket atau W3 Total Cache, bersihkan cache setelah menambahkan kode.