Kategori: Saluran Komunikasi

Tahap: 🟢 Beginner

Sasaran: 👤 Client & 🛠 Agency Administrator

Masa Membaca: ±15 minit

---

Pengenalan

Selepas memahami apa itu Web Widget dan bagaimana ia berfungsi, langkah seterusnya ialah memasangnya pada laman web anda.

Web Widget ialah pintu masuk utama kepada pelanggan yang melayari laman web atau landing page anda. Dengan pemasangan yang betul, pengunjung boleh terus memulakan perbualan tanpa perlu mencari nombor telefon atau alamat e-mel.

Dalam panduan ini, anda akan belajar cara menyediakan Web Widget dan memastikan ia bersedia untuk digunakan.

---

🎯 Objektif

Selepas mengikuti panduan ini, anda akan dapat:

• Mencipta Web Widget baharu.
• Mengakses tetapan Widget dalam AnyChat.
• Mendapatkan kod pemasangan (embed code).
• Memasang widget pada laman web.
• Mengesahkan bahawa widget berfungsi dengan betul.

---

📋 Prasyarat

Sebelum bermula, pastikan perkara berikut telah disediakan:

• Akaun AnyChat telah diaktifkan.
• Anda mempunyai akses sebagai Administrator atau Agency Administrator.
• Laman web atau Landing Page telah diterbitkan.
• Anda mempunyai akses untuk mengubah kod HTML laman web atau menggunakan integrasi yang disokong.
• Sambungan internet stabil.

---

Langkah 1 – Buka Modul Widgets

Daripada menu utama AnyChat:

Settings → Widgets

Di sinilah semua widget akan diuruskan.

📸 Screenshot Dicadangkan

Paparan menu Settings → Widgets.

---

Langkah 2 – Cipta Web Widget Baharu

Klik butang Create Widget atau Add Widget (bergantung pada versi AnyChat).

Masukkan maklumat asas seperti:

• Nama Widget.
• Jenis Widget.
• Domain atau laman web yang akan menggunakan widget.

Nama widget sebaiknya mudah dikenal pasti, contohnya:

• ResellerMY Main Website
• Landing Page Hosting
• Support Widget
• Sales Widget

Ini memudahkan pengurusan jika anda mempunyai beberapa laman web.

📸 Screenshot Dicadangkan

Borang penciptaan Web Widget.

---

Langkah 3 – Konfigurasi Asas Widget

Selepas widget dicipta, lakukan konfigurasi awal.

Antara tetapan yang biasanya tersedia ialah:

• Nama widget.
• Bahasa.
• Kedudukan widget (kanan atau kiri).
• Waktu operasi.
• Mesej alu-aluan.
• Avatar atau logo.
• Warna tema.

Pada peringkat ini, anda belum perlu mengubah semua tetapan lanjutan. Fokus kepada konfigurasi asas terlebih dahulu.

---

Langkah 4 – Dapatkan Kod Widget

Selepas konfigurasi disimpan, AnyChat akan menjana kod pemasangan.

Kod ini biasanya berbentuk JavaScript dan perlu ditampal pada laman web anda.

📸 Screenshot Dicadangkan

Paparan kod pemasangan (embed code).

---

Langkah 5 – Pasang Kod Pada Laman Web

Salin kod yang diberikan dan tampalkan sebelum tag penutup </body> pada laman web anda.

Jika anda menggunakan platform seperti WordPress, pemasangan boleh dilakukan melalui:

• Plugin Header & Footer.
• Custom Code.
• Theme Settings.
• Google Tag Manager (jika sesuai).

Bagi pelanggan Landing Page by ResellerMY, pemasangan widget biasanya dilakukan oleh pihak kami semasa proses penyediaan laman.

---

Langkah 6 – Simpan dan Terbitkan

Selepas kod dipasang:

• Simpan perubahan.
• Terbitkan laman web (jika perlu).
• Muat semula halaman.

Widget sepatutnya mula dipaparkan.

---

Langkah 7 – Uji Widget

Buka laman web menggunakan pelayar web.

Semak perkara berikut:

✅ Ikon widget dipaparkan.

✅ Widget boleh dibuka.

✅ Borang atau ruang sembang berfungsi.

✅ Mesej boleh dihantar.

Jika semua langkah berjaya, Web Widget telah dipasang dengan betul.

---

Bagaimana Jika Widget Tidak Muncul?

Semak beberapa perkara berikut:

• Kod dipasang pada halaman yang betul.
• Kod tidak diubah suai.
• Domain yang digunakan sepadan dengan konfigurasi widget.
• Tiada ralat JavaScript pada laman web.
• Cache pelayar atau cache laman web telah dikosongkan.

Jika masih gagal, cuba gunakan pelayar lain atau mod Incognito untuk memastikan isu tersebut bukan disebabkan cache.

---

Kesilapan Yang Sering Berlaku

Antara kesilapan yang sering dilakukan ialah:

❌ Menampal kod lebih daripada sekali.

❌ Memasang kod pada domain yang salah.

❌ Terlupa menerbitkan perubahan pada laman web.

❌ Tidak menguji widget selepas pemasangan.

Mengelakkan kesilapan ini boleh menjimatkan banyak masa semasa proses penyelesaian masalah.

---

💡 Tip ResellerMY

Jika anda mengurus beberapa laman web pelanggan, gunakan nama widget yang jelas dan konsisten.

Contohnya:

• RMY - KMYHost
• RMY - Klinik ABC
• RMY - Travel X
• RMY - Landing Page A

Penamaan yang baik memudahkan penyelenggaraan dan mengelakkan kekeliruan apabila jumlah widget semakin banyak.

---

🌍 Senario Dunia Sebenar

ResellerMY membina Landing Page untuk sebuah syarikat katering.

Semasa laman disiapkan, Web Widget turut dipasang menggunakan kod yang dijana oleh AnyChat.

Pada hari pertama kempen iklan dijalankan, bakal pelanggan boleh terus bertanya mengenai pakej katering melalui widget tanpa meninggalkan laman web. Semua pertanyaan masuk ke Inbox AnyChat dan pasukan jualan dapat memberi respons dengan cepat.

Hasilnya, proses pertanyaan menjadi lebih lancar dan kadar penukaran (conversion) berpotensi meningkat kerana pelanggan tidak perlu mencari saluran komunikasi lain.

---

📌 Nota ResellerMY

Bagi pelanggan yang melanggan perkhidmatan Landing Page by ResellerMY, pemasangan asas Web Widget biasanya termasuk dalam proses penyerahan projek.

Walau bagaimanapun, pelanggan masih digalakkan memahami cara pemasangan ini supaya mereka boleh melakukan semakan atau menambah widget pada laman web lain pada masa hadapan.

---

❓ Soalan Lazim

Adakah saya boleh menggunakan satu widget pada beberapa laman web?

Bergantung kepada cara anda mengurus widget dan tetapan domain dalam AnyChat. Untuk pengurusan yang lebih kemas, kami mengesyorkan satu widget bagi setiap laman web.

---

Adakah saya perlu tahu pengaturcaraan?

Tidak semestinya. Dalam kebanyakan kes, anda hanya perlu menyalin dan menampal kod yang dijana oleh AnyChat.

---

Berapa lama widget mengambil masa untuk dipaparkan?

Biasanya beberapa saat selepas kod dipasang dan laman web dimuat semula. Jika terdapat kelewatan, semak cache pelayar atau cache laman web.

---

📖 Learning Path

✅ 2.1 Apa itu Communication Channels?

✅ 2.2 Bagaimana Communication Channels Berfungsi?

✅ 2.3 Memilih Saluran Komunikasi

✅ 2.4 Web Widget – Pengenalan

📍 Anda sedang membaca: 2.5 Menyediakan dan Memasang Web Widget

➡️ Seterusnya: 2.6 Menyesuaikan Reka Bentuk dan Tetapan Web Widget

---