Cara Menambah Chatbot AI Asyntai ke OpenCart

Panduan langkah demi langkah untuk laman web OpenCart

Platform:

The Easy Way: Install the Asyntai Extension

We publish a free extension on the OpenCart Marketplace. It puts the chatbot on your storefront and connects your account, and there is no code to copy and no template to edit. It works on OpenCart 3.x and 4.x.

Download Asyntai - AI Chatbot from the OpenCart Marketplace
In your admin panel, go to Extensions → Installer and upload the ZIP file
Go to Extensions → Extensions, choose Modules in the list, find Asyntai AI Chatbot and press the green install button
Press edit, then press Connect to Asyntai. A window opens where you sign in or create an account.

That is all. The chatbot is live on your storefront when the window closes.

Your products, prices and stock

When you connect, the extension also lets Asyntai read your catalogue. Your assistant then answers with the price you charge today and tells shoppers what is in stock, instead of repeating whatever your pages said when they were last read.

Asyntai reads your products through a read-only address on your own store. Every request is signed, and the reply carries the prices a shopper would actually pay, with your tax rules already applied. You can switch this off at any time on the extension's settings screen.

Updating from version 1.0.0? OpenCart clears a module's settings when you uninstall it, so press Connect to Asyntai once after the update. From this version on, updates keep your connection.

Or Add the Code Yourself

Prefer not to install an extension? The rest of this page shows how to add the chatbot by hand. You will not get the catalogue reading this way.

Langkah 1: Dapatkan Kod Benam Anda

First, go to your Asyntai Dashboard and scroll down to the "Embed Code" section. Copy your unique embed code which will look like this:

<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>

Nota: Kod di atas hanyalah contoh. Anda mesti menyalin kod benam unik anda sendiri dari Papan Pemuka anda kerana ia mengandungi ID widget peribadi anda.

Step 2: Edit Footer Template

Cara paling mudah untuk menambah chatbot adalah dengan mengedit templat footer tema anda:

Akses fail OpenCart anda melalui FTP atau pengurus fail
Navigasi ke templat footer tema anda:
- OpenCart 3.x/4.x: catalog/view/theme/YOUR_THEME/template/common/footer.twig
- OpenCart 2.x: catalog/view/theme/YOUR_THEME/template/common/footer.tpl
Buka fail footer untuk diedit
Cari tag penutup </body>
Tampal kod benam Asyntai anda sejurus sebelum tag </body>
Simpan fail
Kosongkan cache OpenCart: Dashboard → Ikon gear biru (kanan atas) → Refresh atau padam kandungan system/storage/cache/

Petua: Jika anda menggunakan tema lalai, laluan akan menjadi catalog/view/theme/default/template/common/footer.twig. Sentiasa buat sandaran sebelum mengedit fail templat.

Alternatif: Menggunakan Pilihan Kod Tersuai Tema

Banyak tema OpenCart moden menyertakan pilihan terbina dalam untuk kod tersuai:

Log masuk ke Panel Admin OpenCart anda
Pergi ke Extensions → Themes (atau Extensions → Extensions → Themes)
Klik Edit pada tema aktif anda
Cari bahagian "Custom Code", "Footer Scripts", atau "Custom JavaScript"
Tampal kod benam Asyntai anda
Klik "Save"
Kosongkan cache

Nota: Tidak semua tema mempunyai pilihan ini. Jika tema anda tidak menyertakan medan kod tersuai, gunakan kaedah pengeditan templat atau pasang sambungan.

Alternatif: Menggunakan Sambungan Kod Tersuai

Anda boleh memasang sambungan percuma dari OpenCart Marketplace untuk menambah skrip tersuai:

Go to the OpenCart Marketplace
Cari "Custom Script", "Header Footer Scripts", atau "Custom Code"
Muat turun dan pasang sambungan yang sesuai
Dalam panel admin anda, pergi ke Extensions → Extensions → Modules
Cari dan pasang modul kod tersuai
Konfigurasikan modul dan tampal kod benam Asyntai anda dalam bahagian footer
Simpan dan kosongkan cache

Penting: Menggunakan sambungan disyorkan berbanding mengedit fail teras, kerana ia kekal selepas kemas kini OpenCart. Sambungan popular termasuk "Custom Script in Header & Footer" yang tersedia di marketplace.

Alternatif: Menggunakan Kaedah addScript (Untuk Pembangun)

Untuk pembangun, OpenCart 3.x/4.x menyediakan cara programatik untuk menambah skrip:

Buka catalog/controller/common/footer.php
Tambah baris berikut sebelum $data['scripts'] = $this->document->getScripts('footer');:
$this->document->addScript('https://asyntai.com/static/js/chat-widget.js', 'footer');
Untuk atribut data, anda perlu mengubah suai footer.twig untuk memasukkannya secara manual, atau menambah JavaScript sebaris selepas gelung skrip

Nota: Untuk widget berfungsi dengan betul dengan atribut data, kaedah templat lebih mudah kerana kaedah addScript tidak menyokong atribut tersuai secara langsung.

Langkah 3: Sahkan Pemasangan

Selepas menyimpan perubahan anda dan mengosongkan cache, lawati kedai anda dalam tab pelayar baharu atau tetingkap inkognito. Anda sepatutnya melihat butang widget sembang di sudut kanan bawah. Klik padanya untuk memastikan ia dibuka dan berfungsi dengan betul.

Tidak nampak widget? Pastikan untuk mengosongkan cache OpenCart. Pergi ke panel admin anda, klik ikon gear biru di sudut kanan atas, dan klik butang muat semula. Cuba juga kosongkan cache pelayar anda atau lihat dalam tetingkap inkognito. Jika anda mengubah suai fail templat yang salah, semak bahawa tema anda menggunakan fail yang anda edit.

Dokumentasi