Cara Menambahkan Chatbot AI Asyntai ke Adobe Commerce (Magento)

Panduan langkah demi langkah untuk situs web Magento

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 Page Builder (Direkomendasikan)

Cara termudah untuk menambahkan chatbot adalah menggunakan blok HTML Code dari Page Builder:

Masuk ke Panel Admin Magento Anda
Buka Content → Pages
Edit Halaman Beranda Anda (atau halaman mana pun yang ingin Anda tambahkan chatbot)
Di Page Builder, seret elemen "HTML Code" ke halaman
Tempel kode embed Asyntai Anda
Klik "Save"
Bersihkan cache: System → Cache Management → Flush Magento Cache

Penting: Menggunakan Page Builder hanya menambahkan kode ke halaman individual. Untuk instalasi seluruh situs, gunakan metode Layout XML di bawah.

Alternatif: Menggunakan Layout XML (Semua Halaman)

Untuk menambahkan chatbot ke semua halaman, buat file layout di tema Anda:

Navigasi ke folder tema Anda: app/design/frontend/[Vendor]/[theme]/
Buat struktur folder jika belum ada: Magento_Theme/layout/
Buat atau edit file default_head_blocks.xml
Tambahkan kode berikut:
<?xml version="1.0"?> <page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd"> <head> <script src="https://asyntai.com/static/js/chat-widget.js" src_type="url" async="true" data-asyntai-id="YOUR_WIDGET_ID"/> </head> </page>
Ganti YOUR_WIDGET_ID dengan ID widget Anda yang sebenarnya
Jalankan: bin/magento cache:flush
Jalankan: bin/magento setup:static-content:deploy -f (jika dalam mode produksi)

Alternatif: Menggunakan CMS Block

Anda juga dapat membuat CMS block dan menyertakannya di footer Anda:

Buka Content → Blocks
Klik "Add New Block"
Tetapkan judul seperti "Asyntai Chatbot\
Tetapkan Identifier ke asyntai_chatbot
Di editor konten, alihkan ke mode HTML dan tempel kode embed Anda
Klik "Save Block"
Tambahkan blok ke template footer Anda menggunakan: {{block id="asyntai_chatbot"}}
Bersihkan cache

Langkah 3: Verifikasi Instalasi

Setelah menyimpan perubahan dan membersihkan cache, kunjungi toko 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.