Cara Menambahkan Chatbot AI Asyntai ke Squarespace

Panduan langkah demi langkah untuk situs web Squarespace

Platform:

Langkah 1: Dapatkan Kode Embed Anda

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

<script>(function(){var l=function(){var s=document.createElement("script");s.src="https://widget.asyntai.com/static/js/chat-widget.js";s.async=true;s.setAttribute("data-asyntai-id","YOUR_WIDGET_ID");document.head.appendChild(s)};if(document.readyState==="complete"){l()}else{window.addEventListener("load",l)}})();</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 Kode Menggunakan Code Injection

Jika situs Anda menggunakan paket Squarespace Core, Plus, atau Advanced (atau paket Business atau Commerce yang lebih lama), Anda dapat menambahkan chatbot ke semua halaman sekaligus menggunakan Code Injection:

Masuk ke akun Squarespace Anda dan buka situs Anda
Klik Pages di panel kiri
Klik Custom Code di bagian bawah panel
Klik Code Injection
Gulir ke bawah ke bagian Footer
Tempel kode embed Asyntai Anda di kotak teks Footer
Klik "Save"

Catatan: Di Squarespace 7.0, Code Injection berada di Pages → Website Tools.

Tips: Menambahkan kode ke bagian Footer menempatkannya tepat sebelum tag penutup </body>, yang merupakan penempatan yang direkomendasikan untuk widget chat dan tidak akan memperlambat pemuatan halaman Anda.

Alternatif: Menggunakan Code Block

Untuk menambahkan chatbot hanya ke halaman tertentu, Anda dapat menggunakan Code Block. Code Block hanya menjalankan JavaScript pada paket Core, Plus, atau Advanced (atau paket Business atau Commerce yang lebih lama).

Buka situs Anda di Editor Squarespace
Navigasi ke halaman di mana Anda ingin menambahkan chatbot
Klik "Edit" pada halaman
Arahkan kursor ke bagian dan klik "+ Add Block"
Gulir ke bawah dan pilih "Code"
Klik ikon pensil untuk mengedit blok kode
Tempel kode embed Asyntai Anda
Pastikan menu Mode pada blok diatur ke HTML
Klik di luar blok untuk menutup editor
Klik "Save"

Penting: Saat menggunakan Code Block, Anda perlu menambahkan kode ke setiap halaman tempat Anda ingin chatbot muncul. Untuk pemasangan di seluruh situs, gunakan metode Code Injection di atas.

Langkah 3: Verifikasi Instalasi

Setelah menyimpan perubahan Anda, buka situs web 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 Anda telah menyimpan dan mempublikasikan perubahan Anda. Coba bersihkan cache browser atau lihat situs Anda di jendela penyamaran. Squarespace mungkin memerlukan beberapa menit untuk menerapkan perubahan kode. Kode terkadang tidak berjalan saat Anda masuk ke Squarespace, jadi periksa situs di jendela pribadi.

Menambahkan Bilah Pencarian AI

Bilah Pencarian AI adalah widget terpisah dengan kodenya sendiri. Tambahkan bersama chat, atau sendirian. Ia memerlukan paket Standard atau lebih tinggi: pada paket lebih rendah bilah muncul tetapi tidak menampilkan hasil.

Tambahkan atribut data-replace pada tag script dan bilah ini akan menggantikan bilah pencarian bawaan tema Anda. Tambahkan di Pages, Custom Code, Code Injection, Footer, tempat yang sama dengan kode chat. Squarespace hanya menyediakan Code Injection pada paket Core, Plus, atau Advanced (atau paket Business atau Commerce yang lebih lama), jadi Anda memerlukan salah satunya untuk memasang ini.

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