Cara Menambahkan Chatbot AI ke Situs Web Anda Tanpa Kode

Anda dapat menambahkan chatbot AI ke situs web Anda dengan memberikan pengetahuan bisnis kepada Agent, mengonfigurasi balasannya, dan memasang widget chat melalui plugin atau skrip yang disediakan. Chatbot situs web Quickchat AI menyatukan pengetahuan, pengaturan percakapan, dan Inbox tim. Pengunjung dapat mengajukan pertanyaan di situs Anda tanpa membuat akun.

Tutorial ini membuat Kestrel Kitchens, bisnis desain dapur fiktif. Pengunjung menanyakan durasi renovasi, memeriksa perkiraan biaya dapur berukuran 3 kali 4 meter, lalu meminta penawaran. Agent menjawab berdasarkan informasi perusahaan, mengumpulkan detail proyek, dan memungkinkan desainer melanjutkan percakapan.

Pengaturan inti tidak memerlukan pemrograman. Ikuti langkah pengetahuan dan instruksi, pengumpulan prospek, dan penerusan ke staf, lalu pasang widget. API Action opsional mengirim permintaan yang lengkap ke sistem lain.

Unduh paket pengaturan Kestrel Kitchens untuk mendapatkan situs web contoh, pengetahuan, Main Prompt, pengaturan, dan pesan pengujian. File-file ini dapat diedit untuk mengikuti langkah di dashboard, bukan untuk mengimpor Agent dengan satu klik. Tangkapan layar serta artefak paket, prompt, dan konfigurasi yang dapat disalin tetap berbahasa Inggris agar contoh yang telah diuji dapat direproduksi.

Apa yang akan dilakukan chatbot situs web?

Chatbot menjawab pertanyaan berdasarkan konten Anda, menyimpan detail tindak lanjut yang diminta, dan meneruskan percakapan ke tim ketika bantuan manusia diperlukan.

Setiap hasil tersebut membutuhkan bukti yang berbeda. Kisaran harga yang benar berasal dari Knowledge Base. Permintaan penawaran membutuhkan detail kontak dan proyek di Inbox. Penerusan membutuhkan staf yang mengambil alih penanganan dan mengirim balasan yang diterima pengunjung.

Perjalanan pengunjung dalam contoh. Permintaan penawaran mencatat minat; desainer tetap perlu mengonfirmasi harga dan ketersediaan.

Apa yang diperlukan sebelum menambahkan chatbot?

Anda membutuhkan akun Quickchat AI, informasi bisnis yang dapat diverifikasi, dan akses ke pengaturan plugin atau kode khusus situs web.

1. Buat akun Quickchat AI dan selesaikan langkah pendaftaran. Gunakan Agent terpisah untuk latihan ini agar fakta contoh tidak memengaruhi layanan pelanggan yang sudah ada.
2. Siapkan halaman layanan, FAQ, dan kebijakan Anda, atau gunakan pengetahuan fiktif dalam paket. Ganti harga dan wilayah layanan fiktif sebelum menerapkannya untuk bisnis nyata.
3. Pastikan paket situs web Anda mengizinkan metode pemasangan yang sesuai. WordPress membutuhkan akses plugin; beberapa pembuat situs yang dihosting memerlukan paket berbayar untuk kode khusus yang berlaku di seluruh situs.
4. Siapkan seseorang untuk memantau Inbox pengujian saat Anda mencoba penerusan ke staf. Sediakan browser desktop dan ponsel untuk pemeriksaan situs web terakhir.

Free ditujukan untuk pembelajaran pribadi nonkomersial. Paket Free mencakup 50 kredit AI per bulan. Penerapan untuk bisnis membutuhkan paket komersial, dan pengujian menggunakan kuota balasan yang sama dengan percakapan AI lainnya. Langganan pembuat situs web dan biaya API eksternal terpisah. Bagian biaya menjelaskan perbedaannya.

Langkah 1: Bagaimana melatih chatbot dengan situs web Anda?

Tambahkan halaman yang memuat jawaban bisnis Anda ke Knowledge Base, lalu verifikasi konten yang diimpor sebelum menguji. Dengan begitu, Agent memiliki materi referensi untuk balasannya.

Buat Agent untuk belajar

1. Pada layar pengaturan pertama, pilih Set up manually. Dari dashboard yang sudah ada, gunakan + di samping AI Agent (Add new AI Agent) untuk membuat Agent terpisah, lalu pilih Set up manually.
2. Di Identity, masukkan Kestrel Kitchens pada Name your AI Agent. Tempelkan main-prompt.txt dari paket ke Describe what you want your agent to do. Teks ini menjadi Main Prompt Agent, yang dijelaskan pada Langkah 2. Pilih Next.
3. Biarkan Knowledge Base kosong untuk saat ini dan pilih Next. Lanjutkan melalui External apps tanpa memilih koneksi. Di Deployment, pilih Chat widget, lalu Next.
4. Pada Choose your plan, gunakan Skip for now untuk melanjutkan latihan pembelajaran pribadi, atau pilih paket komersial yang sesuai untuk penggunaan bisnis. Selesaikan atau tutup penawaran opsional yang muncul setelahnya.
5. Di dashboard, konfirmasi nama Agent di Identity, lalu buka Knowledge Base. Pilih halaman Anda sendiri atau artikel contoh yang disediakan di bawah.

Impor halaman Anda sendiri

1. Di Knowledge Base, pilih Add Website. Pilih satu halaman atau opsi impor situs web sesuai kebutuhan.
2. Masukkan URL publik. Untuk impor situs web, tinjau halaman yang ditemukan dan pilih halaman layanan, harga, proses, serta FAQ yang akan menjadi dasar jawaban.
3. Periksa teks yang diimpor. Pastikan harga mencakup mata uang dan perlakuan pajak yang benar, serta promosi lama atau halaman yang tidak relevan tidak ikut menjadi sumber.
4. Tunggu hingga pemrosesan selesai. Terapkan atau publikasikan perubahan pengetahuan tertunda yang ditampilkan dashboard sebelum menguji widget yang terpasang.

Mulailah dengan beberapa halaman yang jelas. Situs dapat menampilkan kartu harga yang menarik tetapi menaruh ketentuannya di tempat lain; Agent membutuhkan keduanya. Mengimpor halaman beranda saja dapat melewatkan ketentuan pemasangan, batas wilayah, atau kebijakan pengembalian dana yang membuat jawaban berguna.

Gunakan sumber Kestrel Kitchens

Untuk mereproduksi contoh tanpa menghosting situs web terlebih dahulu, tambahkan faktanya secara langsung:

1. Di Knowledge Base, pilih Add Article. Ini membuat artikel Untitled dan membuka Edit Article.
2. Masukkan Kestrel Kitchens: services, prices and process di Title. Pada Content, pilih Plain Text dan tempelkan knowledge.txt dari paket.
3. Pilih Save dan tunggu hingga status artikel menjadi Ready. Pastikan judulnya muncul dalam daftar Knowledge Base.

Artikel tersimpan mempertahankan ketentuan harga dan jadwal. Fakta fiktifnya sesuai dengan situs web contoh.

Kestrel Kitchens is a fictional kitchen design and renovation business used in this tutorial. It serves Bristol, Bath and addresses within 25 miles of central Bristol.

Services: kitchen design, supply and full installation. A full kitchen renovation typically costs £18,000 to £45,000 including VAT. This is a planning range, not a quote. The final price depends on the survey, layout, cabinetry, appliances and building work. Room dimensions alone are not enough to calculate a firm price.

Timelines: survey and design normally take 2 to 3 weeks. Installation usually takes 4 to 8 weeks after all materials are available. These are typical durations, not a promised start date or completion date.

Process: discuss the project, arrange a site survey, agree the design and receive a written quote, then schedule work once the quote is accepted and materials are available. The chatbot cannot book a survey or confirm availability.

The design team works Monday to Friday, 09:00 to 17:00, Europe/London. Quote enquiries need the visitor's full name, email, postcode and project type. A preferred timeline is helpful but optional. The team follows up by email. Do not promise a response deadline.

Sumber sengaja tidak menjelaskan pembiayaan. Ini memberi Anda pengujian yang berguna untuk melihat cara Agent menangani kekurangan informasi yang nyata. Untuk situs sebenarnya, perbarui halaman sumber dan gunakan pengaturan penyegaran yang didukung jika tersedia; panduan Knowledge Base menjelaskan cara mengatur dan menguji sumber tersebut.

Langkah 2: Apa yang harus disampaikan chatbot dan tidak boleh dijanjikan?

Gunakan Main Prompt untuk menentukan cara Agent menerapkan pengetahuan: menjawab terlebih dahulu, memberikan balasan yang berguna, dan menyerahkan keputusan seperti penawaran pasti kepada tim.

Untuk Kestrel, dimensi ruangan menunjukkan skala proyek. Dimensi tersebut tidak menentukan kabinet, peralatan, atau pekerjaan bangunan. Agent harus menjelaskan kisaran perencanaan £18,000 hingga £45,000 dari sumber, termasuk VAT, tanpa menghitung harga yang lebih presisi berdasarkan luas lantai.

Harga ini adalah data fiktif untuk tutorial. Hal yang perlu dipelajari adalah mempertahankan perbedaan antara fakta dari sumber dan keputusan yang masih perlu diambil tim Anda.

1. Di Identity, pilih Edit pada kartu Main Prompt.
2. Tempelkan seluruh prompt di bawah. Tunggu hingga tersimpan, lalu buka kembali editor untuk mengonfirmasi teks yang tersimpan.
3. Simpan fakta bisnis di Knowledge Base. Gunakan prompt untuk gaya balasan, perilaku pengumpulan data, dan keputusan yang membutuhkan manusia.

Main Prompt adalah kolom instruksi. Teks lengkap di bawah dan dalam paket adalah versi yang dapat disalin.

You are the website assistant for Kestrel Kitchens. Help visitors understand our services, indicative prices and process using the Knowledge Base.

Answer the visitor's question before asking for contact details. Keep replies concise, usually two to four sentences. Use the visitor's language.

Treat prices as planning ranges. Never calculate a firm quote from room dimensions, invent a discount, promise a start date, confirm a survey booking or claim financing is available. If the Knowledge Base does not answer a question, say that a designer must confirm it.

When a visitor wants a quote or follow-up, collect their full name, email, postcode and project type in conversation. Ask one or two relevant questions at a time. Ask about their preferred timeline only after the required details, and accept a refusal without pressure. Do not ask for payment information.

Offer Human Handoff when the visitor asks for a designer or needs information you cannot confirm. Respect the configured working hours. Never claim that a designer is connected or a quote is booked. If the team is unavailable, offer an email follow-up.

Acknowledge the details the visitor has provided. Do not claim CRM delivery or a confirmed booking. The design team reviews enquiries in the Inbox.

Buka AI Preview dan tanyakan How long does a full kitchen renovation take?. Dalam pengujian kontrol lokal, Agent menjawab 2 hingga 3 minggu untuk survei dan desain, lalu 4 hingga 8 minggu untuk pemasangan setelah bahan tersedia. Durasi dan ketentuannya sama-sama penting.

Mulai percakapan baru dan tanyakan Do you offer financing?. Balasan yang benar mengakui bahwa sumber tidak memastikan adanya penawaran tersebut dan mengarahkan pertanyaan kepada desainer. Menambahkan kata-kata yang lebih meyakinkan pada prompt tidak akan menyediakan fakta bisnis yang belum ada.

Langkah 3: Bagaimana mengumpulkan permintaan penawaran dalam chat?

Smart Data Gathering meminta informasi yang dipilih selama percakapan dan menyimpan informasi yang diberikan pengunjung. Untuk permintaan penawaran, kumpulkan hanya informasi yang dibutuhkan desainer untuk menindaklanjuti.

1. Buka Actions & MCPs, aktifkan Smart Data Gathering, dan pilih Edit Action. Atur Name menjadi Quote enquiries dan Description menjadi Capture contact and project details for a kitchen design enquiry. Nama yang disimpan menjadi judul kartu.
2. Pada Data to collect, tambahkan baris di bawah. Pertahankan nama Data point berbahasa Inggris ini saat mereproduksi contoh; nama kontak memiliki pemetaan khusus ke kolom pengunjung di Inbox.
3. Atur Reason for collecting information menjadi So a Kestrel Kitchens designer can assess your project and follow up by email.
4. Atur When to ask for data menjadi After exchanging a few messages, dan How to ask for data menjadi Subtle.
5. Simpan Action. Di AI Preview, ajukan pertanyaan layanan yang berguna sebelum meminta penawaran, lalu periksa detail yang tersimpan di Inbox.

Pertanyaan menjelaskan informasi yang perlu dikumpulkan. Pengaturan waktu dan gaya memandu kapan informasi diminta; uji juga percakapan yang sebenarnya.

Nama, email, kode pos, dan jenis proyek adalah detail wajib agar permintaan lengkap dalam contoh ini terpenuhi. Jadwal bersifat opsional, seperti dijelaskan dalam Main Prompt. Persyaratan bisnis ini terpisah dari pengaturan pengumpulan dalam percakapan; Langkah 8 memastikan kolom wajib terisi sebelum permintaan dikirim ke CRM.

Agent seharusnya menjawab pertanyaan umum tentang biaya tanpa mensyaratkan alamat email untuk mendapatkan jawaban. Pengunjung juga dapat menolak pengumpulan data. Gunakan I am only researching. I do not want to leave contact details. untuk memeriksa bahwa percakapan tetap berguna tanpa permintaan berulang.

Ke mana detail yang dikumpulkan disimpan?

Buka percakapan di Inbox. Detail kontak standar muncul pada kolom pengunjungnya; nilai lain yang dikumpulkan tetap melekat pada percakapan dan dapat diekspor melalui Export Gathered Data.

Pada Where to send data, Email new leads memberi tahu setiap admin Agent saat alamat email atau nomor telepon pertama kali dikumpulkan. Nama saja tidak memicu pengiriman email. Preview dan Simulation tidak mengirim notifikasi ini, jadi verifikasi kotak masuk admin Anda melalui pengujian terkontrol pada widget terpasang sebelum mengandalkan pengiriman email. Panduan lokal ini menonaktifkan pengiriman email eksternal.

Dokumentasi Smart Data Gathering menjelaskan pengumpulan, notifikasi, dan ekspor. Untuk situs Anda sendiri, jelaskan alasan meminta informasi dan tautkan pemberitahuan privasi di widget. Panduan perlindungan data chatbot membantu meninjau alur data secara lebih luas.

Langkah 4: Bagaimana memungkinkan staf mengambil alih chat?

Human Handoff meneruskan percakapan ke tim Anda; staf kemudian mengambil alih di Inbox dan membalas pengunjung yang sama.

Siapkan penerusan sebelum memublikasikan widget. Pengunjung yang meminta desainer seharusnya tidak perlu menyelesaikan formulir penawaran terlebih dahulu, dan Agent tidak boleh menyiratkan ada staf yang online di luar jam kerja.

1. Di Actions & MCPs, aktifkan Human Handoff dan buka Edit Action.
2. Biarkan aturan standar Media Message, User Frustration, Customer Support Suggestion, dan Lack Of Knowledge aktif; biarkan Irrelevant Advice nonaktif. Main Prompt sudah menjelaskan kapan perlu menawarkan bantuan desainer. Contoh yang diuji menggunakan aturan standar ini tanpa menambahkan aturan khusus.
3. Konfigurasikan pesan dan ketersediaan di bawah, lalu simpan. Biarkan Email notifications nonaktif untuk latihan pembelajaran dan periksa penerusan langsung di Inbox.

Gunakan jam ketika staf benar-benar memantau Inbox. Jadwal fiktif ini bukan janji balasan langsung.

Pada jam kerja staf, tanyakan Can I speak to a designer? dari situs web. Selesaikan konfirmasi penerusan yang diminta Agent. Di Inbox, buka percakapan dan pilih Assign to me ketika belum ditugaskan, atau Take over ketika kontrol tersebut ditampilkan. Kirim balasan staf dan pastikan pengunjung menerimanya. Gunakan Reassign to AI ketika AI perlu melanjutkan.

Periksa siapa yang menangani percakapan dan apakah balasan staf diterima, bukan hanya tawaran Agent untuk meneruskan.

Ulangi dalam percakapan baru di luar jam yang dikonfigurasi. Agent harus menjelaskan ketersediaan dan menawarkan jalur tindak lanjut yang ditetapkan. Jika Anda mengubah jadwal sementara untuk melakukan pemeriksaan ini, kembalikan jadwal sebenarnya setelahnya. Dokumentasi Human Handoff menjelaskan pengaturan dan alur Inbox.

Panduan pengalihan dari chatbot ke manusia mencakup pemeriksaan terpisah untuk penanggung jawab percakapan, pengembalian percakapan ke AI, dan kegagalan di luar jam kerja.

Langkah 5: Bagaimana menyesuaikan widget dengan situs web Anda?

Atur tampilan visual dan teks tetap pada Channels → Your Website. Buat pesan sambutan yang cukup spesifik untuk menjelaskan apa yang dapat ditanyakan pengunjung.

Tampilan

1. Buka Appearance. Untuk Kestrel, pilih tema Custom dengan latar putih, header dan aksen hijau tua (#315448), serta teks header putih. Pertahankan ukuran teks bawaan dan kontrol membulat.
2. Pada Branding → AI Agent Avatar, klik ikon unggah avatar, pilih website/kestrel-avatar.png dari paket, dan pilih Upload dalam dialog pemotongan gambar.
3. Atur Widget window max width menjadi 400px dan Widget window max height menjadi 520px. Pilih Small untuk ukuran tombol pembuka, posisikan di kanan, dan gunakan Ask about your kitchen sebagai labelnya. Label tersedia pada tombol pembuka kecil. Pratinjau posisinya terhadap banner cookie atau kontrol mengambang lain di situs Anda.
4. Biarkan Auto-open Widget nonaktif. Membuka widget setiap kali halaman dimuat mengganggu penjelajahan, terutama di ponsel.

Periksa pratinjau saat memilih warna. Pengujian di situs web langsung tetap penting karena tombol pembuka berbagi ruang dengan kontrol situs Anda.

Konten teks

Buka Text Content dan gunakan nilai berikut:

Pembuka percakapan sebaiknya memulai tugas yang berguna. Penafian memberi tahu pengunjung keputusan mana yang masih membutuhkan desainer.

Agent dapat membalas dalam bahasa pengunjung. Penerjemahan pesan sambutan tetap dan label widget adalah pengaturan terpisah pada Other languages, yang tersedia dalam paket berbayar. Untuk situs multibahasa, uji balasan dan teks antarmuka tetap; panduan chatbot multibahasa menjelaskan perbedaannya.

Perubahan tampilan dapat membutuhkan beberapa menit untuk sampai ke sesi pengunjung yang tersimpan dalam cache. Muat ulang sebelum menyimpulkan bahwa perubahan yang disimpan gagal. Hide Quickchat AI Branding memerlukan Professional atau lebih tinggi; panduan white-label membahas area lain yang perlu diperiksa.

Langkah 6: Bagaimana memasang chatbot di situs web Anda?

Pasang Widget pada tata letak bersama situs atau gunakan integrasi platform yang didukung. Widget mengambang perlu berjalan di halaman yang sedang dijelajahi pengunjung.

1. Buka Channels → Your Website → Install.
2. Aktifkan Widget & Embed access untuk widget publik.
3. Pilih metode pemasangan untuk situs web Anda dan salin cuplikan kode atau Scenario ID yang ditampilkan untuk Agent ini.
4. Publikasikan perubahan, buka situs publik, dan ajukan pertanyaan yang Anda ketahui jawabannya ada di Knowledge Base.

Salin dari layar Install Agent ini. Scenario ID-nya adalah pengenal widget publik, bukan kunci API pribadi.

Semua situs web: tempelkan cuplikan Widget sebelum tag body penutup

Pilih Install manually with code dan salin cuplikan Widget. Pemuat saat ini berbentuk seperti berikut:

<script>
  (function(e,a,d,i,c,t=a.createElement(d)){e[c]=e[c]||function(){(e[c].q=e[c].q||[]).push(arguments)},t.src=i,t.async=1,a.body.insertAdjacentElement("beforeend",t)})(window,document,"script","https://bubble.quickchat.ai/chat.js","_quickchat");
  _quickchat("init", "YOUR_SCENARIO_ID");
</script>

Ganti YOUR_SCENARIO_ID dengan nilai dari Install. Tempelkan cuplikan lengkap satu kali, tepat sebelum </body> pada tata letak bersama, atau gunakan kolom footer yang berlaku di seluruh situs pada pembuat situs. Pemuat ini menyisipkan skrip ke body halaman, sehingga meletakkannya di head sebelum body tersedia dapat membuatnya gagal dimuat.

Lokasinya penting. Blok HTML berbasis iframe adalah halaman terpisah dan tidak sesuai untuk Widget mengambang ini.

Opsi Embed yang terpisah menempatkan chat dalam kontainer halaman. Gunakan cuplikan yang dihasilkannya jika Anda menginginkan bagian chat di dalam halaman. Blok HTML yang menyisipkan kode langsung ke halaman dapat mendukung pola tersebut; blok pembuat situs yang mengisolasi kode dalam iframe adalah kasus berbeda. Lihat dokumentasi channel Website.

WordPress: pasang plugin resmi

1. Di WordPress, buka Plugins → Add New, cari Quickchat AI Agent, lalu pilih Install Now dan Activate.
2. Buka Settings → Quickchat AI Agent.
3. Tempelkan Scenario ID dari layar Install Quickchat AI dan pilih Save Changes.
4. Buka halaman publik dan periksa widget. Gunakan plugin atau cuplikan manual saja agar pemuat tidak terpasang dua kali.

Anda membutuhkan instalasi dan paket WordPress yang mengizinkan plugin. Panduan chatbot WordPress menampilkan antarmuka plugin dan pemeriksaan khusus WordPress.

Squarespace: gunakan penyisipan kode Footer

1. Buka panel Code Injection situs. Gunakan pencarian pengaturan di dashboard jika navigasi di akun Anda berbeda.
2. Tempelkan cuplikan Widget lengkap ke Footer dan simpan.
3. Buka halaman yang telah dipublikasikan pada tab browser terpisah dan uji sebuah jawaban.

Squarespace menyediakan Code Injection pada paket Core, Plus, Advanced, dan beberapa paket lama. Penyisipan di Footer menempatkan kode sebelum </body> di seluruh situs. Gunakan area tersebut untuk widget mengambang; blok iframe pada tingkat halaman tidak setara. Kode khusus ini tidak berlaku pada halaman checkout Squarespace.

Wix: gunakan Custom Code pada Body - end

1. Di dashboard situs, buka Settings → Custom Code, lalu + Add Custom Code.
2. Tempelkan cuplikan Widget dan beri nama Quickchat AI widget.
3. Terapkan pada All pages dan pilih Body - end, lalu Apply.
4. Uji situs yang telah dipublikasikan, termasuk navigasi ke halaman lain.

Wix mensyaratkan situs yang sudah dipublikasikan dengan domain terhubung untuk kode khusus. Gunakan pengaturan Custom Code yang berlaku di seluruh situs untuk widget mengambang ini.

Webflow: gunakan Footer code dan publikasikan

1. Buka Site settings → Custom code.
2. Tempelkan cuplikan Widget ke Footer code dan pilih Save changes.
3. Pilih Publish ke domain yang dituju, lalu uji URL yang telah dipublikasikan tersebut.

Pengaturan kode khusus Webflow membutuhkan Workspace berbayar yang memenuhi syarat atau paket Site aktif. Menyimpan pengaturan saja tidak memublikasikannya.

Shopify: pilih cuplikan Agent yang sudah ada atau aplikasi Shopify

Untuk Agent Kestrel yang sudah Anda buat, tambahkan cuplikan Widget-nya tepat sebelum </body> di Online Store → Themes → Edit code → layout/theme.liquid, lalu simpan dan periksa etalase toko. Simpan cadangan tema sebelum mengedit, dan periksa kembali pemasangan setelah mengganti tema. Jalur ini menampilkan Agent yang Anda pilih; jalur ini tidak mengonfigurasi Actions produk atau pesanan.

Untuk Agent yang berfokus pada toko, pengaturan aplikasi Shopify Quickchat AI menghubungkan toko melalui proses onboarding tersendiri. Setelah terhubung, gunakan Enable Widget in Shopify Theme Editor, atau buka Online Store → Themes → Edit theme → App embeds. Aktifkan Quickchat AI Widget dan simpan. Dokumentasi app embed Shopify menjelaskan kontrol tema; aktifkan kembali app embed ketika mengganti tema yang dipublikasikan.

Jalur pembuat situs di atas telah diperiksa berdasarkan dokumentasi resmi. Tangkapan layar panduan menampilkan situs web contoh Kestrel dan widget lokal yang sebenarnya; tangkapan layar tersebut bukan berasal dari akun yang diautentikasi di setiap pembuat situs.

Periksa cuplikan sebelum memecahkan masalah Agent

Pemeriksaan opsional ini menggunakan nilai yang Anda berikan:

• Periksa cuplikan Widget. Periksa kode yang ditempelkan terhadap Scenario ID yang diberikan. Pemeriksaan ini tidak mengambil situs web Anda.
• Bandingkan metode penerapan. Periksa channel, akses situs web, dan fitur yang Anda nyatakan diperlukan terhadap opsi pengaturan Quickchat AI. Pemeriksaan ini tidak memeriksa situs web atau akun Anda.

Pada browser yang kompatibel, pemeriksaan ini juga tersedia sebagai alat situs. Tautan membuka formulir standar.

Langkah 7: Bagaimana menguji chatbot sebelum pengunjung menggunakannya?

Uji jawaban, data tersimpan, dan balasan yang diterima secara terpisah. AI Preview dan Simulation Testing membantu mengevaluasi perilaku; situs web yang dipublikasikan membuktikan bahwa pengunjung dapat menggunakan widget yang terpasang.

Jalankan pertanyaan terpisah di Simulation Testing

Buka Testing → Create Dataset, beri nama Kestrel Kitchens: website launch checks, dan pilih Paste messages. Tambahkan pertanyaan durasi, harga, dan pembiayaan di bawah, dengan baris berisi --- sebagai pemisah antarpertanyaan. Pergantian baris saja membuat teks tetap berada dalam satu pesan pengujian. Atur Evaluation criteria untuk memeriksa fakta dan keringkasan balasan, lalu pilih Run → Start Run. Paket mencakup pesan dan kriteria yang persis digunakan.

Setiap baris dataset memulai percakapan terpisah. Gunakan Simulation untuk pertanyaan terpisah tersebut; lakukan pemeriksaan permintaan penawaran dan pengambilalihan oleh staf yang terdiri dari beberapa giliran dalam satu percakapan AI Preview atau situs web. Periksa log Action dan penerima secara terpisah karena evaluator transkrip tidak dapat memverifikasi pengiriman eksternal.

Buka pengujian yang sudah selesai dan periksa balasannya. Jawaban harga ini mempertahankan kisaran perencanaan; skor balasannya tidak membuktikan pengiriman ke sistem lain.

Gunakan percakapan baru untuk setiap kasus terpisah. Memuat ulang halaman dapat melanjutkan percakapan yang sudah ada, jadi gunakan kontrol chat baru pada widget ketika membutuhkan pengujian baru.

Periksa situs web di ponsel

Pada layar di bawah 768 piksel CSS, widget terbuka menggunakan tata letak layar penuh. Pastikan Anda dapat membukanya, mengetik saat keyboard terlihat, menggulir percakapan, dan menutupnya untuk kembali ke situs.

Akhiri dengan staf sungguhan yang membalas dari Inbox. Jawaban AI yang baik tidak membuktikan bahwa jalur dukungan manusia berfungsi. Ulangi sebagian kecil pemeriksaan ini setelah mengubah sumber, prompt, Actions, atau tema situs.

Langkah 8: Bagaimana mengirim permintaan lengkap ke CRM Anda?

API Action opsional dapat mengirim kolom yang tersimpan ke penerima HTTP setelah seluruh informasi wajib tersedia dalam percakapan. Chatbot situs web inti sudah dapat digunakan tanpa ekstensi ini.

Perbedaan pentingnya adalah antara kontak telah dikumpulkan dan permintaan ini sudah lengkap. Quickchat AI menetapkan lead_captured ketika baru mengumpulkan kolom kontak standar, termasuk nama. Flag ini saja tidak memastikan bahwa email, kode pos, atau jenis proyek sudah tersedia.

Platform memeriksa setiap kondisi. Model mengumpulkan informasi; kondisi menentukan kapan permintaan memenuhi syarat untuk dijalankan.

Siapkan penerima

Gunakan endpoint CRM atau otomatisasi yang Anda kendalikan dan menerima body JSON di bawah. Paket menyertakan penerima demonstrasi lokal kecil bagi pembaca yang ingin memeriksa permintaan sebelum menghubungkan CRM. Instruksi pengaturannya membuat token pribadi dan menjelaskan cara menyediakan endpoint HTTPS sementara. Kirim hanya data pengujian fiktif ke penerima demonstrasi.

Untuk integrasi terkelola sebagai alternatif, ikuti tutorial pelaporan Google Sheets atau panduan CRM khusus. Jangan aktifkan dua alur kerja yang sama-sama membuat prospek yang sama.

Konfigurasikan satu API Action otomatis

1. Buka Actions & MCPs → Custom Actions → Add Action → API Action. Pilih Create manually jika pembuat berbasis deskripsi terbuka.
2. Atur API Action Name menjadi Send quote enquiry.
3. Biarkan What to ask the user first kosong. Action ini membaca kolom yang sudah disimpan Smart Data Gathering; Action tidak meminta model mengisi rangkaian parameter kedua.
4. Pada API Endpoint, pilih POST dan masukkan URL HTTPS /enquiries penerima Anda.
5. Tambahkan header, body, dan kondisi di bawah, lalu simpan dan aktifkan Action.

Masukkan token hanya pada pengaturan header Action. Jangan menaruhnya dalam prompt, cuplikan situs web, atau percakapan pengunjung. README penerima demonstrasi menjelaskan cara membuatnya; gunakan autentikasi yang didokumentasikan CRM Anda untuk integrasi sebenarnya.

Pada tab Body, pilih JSON dan masukkan:

{
  "conversation_id": "{{conversation_id}}",
  "name": "{{metadata_visitor_name}}",
  "email": "{{metadata_visitor_email}}",
  "postcode": "{{metadata_postcode}}",
  "project_type": "{{metadata_project_type}}"
}

Gunakan Add AI Data untuk menyisipkan nilai bawaan dan metadata yang sesuai. conversation_id mengidentifikasi percakapan. Nilai lainnya berasal dari kolom tersimpan; nama kontak berbahasa Inggris dipetakan ke visitor_name dan visitor_email, sedangkan Project type menjadi project_type. Dokumentasi variabel menjelaskan pemetaan ini.

Pada When to run, pilih When metadata matches. Di Run when, tambahkan kelima baris; kondisi metadata digabungkan dengan AND:

Untuk kolom teks ini, is true menolak nilai kosong maupun teks yang dianggap bernilai false. exists hanya memeriksa apakah kunci tersedia; string kosong yang tersimpan dapat lolos. Pengujian di bawah menunjukkan alasan kondisi yang lebih ketat itu penting. Ini memeriksa apakah teks yang dapat digunakan telah diberikan, bukan memverifikasi secara independen identitas pengunjung atau detail properti.

Gunakan API Action Description berikut:

Send a quote enquiry to the design team when the visitor has provided their full name, email, postcode and project type. This records an enquiry only; it does not book a survey or confirm a price.

Dua kondisi pertama dari lima kondisi yang tersimpan. Tambahkan setiap baris dari tabel; When metadata matches memeriksanya setelah giliran AI tanpa Agent memilih Action.

Action dicoba satu kali per percakapan ketika semua kondisi cocok. Action tidak dijalankan lagi saat jadwal opsional diberikan, dan permintaan terkirim yang gagal tidak dicoba ulang secara otomatis dalam percakapan tersebut. Simpan jadwal di Inbox untuk desainer, atau buat integrasi pembuatan dan pembaruan secara eksplisit jika CRM Anda membutuhkan perubahan lanjutan.

Permintaan dijalankan setelah giliran AI, dan responsnya tidak dimasukkan ke chat. Karena itulah Main Prompt mengakui detail yang diberikan pengunjung tanpa mengklaim bahwa CRM telah menerimanya. Verifikasi pengiriman di log Action dan penerima. Dokumentasi Action otomatis menjelaskan perilaku eksekusi ini.

Uji data sebagian, lalu permintaan lengkap

Versi pertama menggunakan exists untuk kolom teks wajib. Sam memberikan nama, lalu email pada pesan berikutnya. Smart Data Gathering sudah membuat nilai kode pos dan jenis proyek yang kosong, sehingga kunci tersebut tersedia dan Action mengirim permintaan yang tidak lengkap. Ini juga menghabiskan satu kesempatan percobaan untuk percakapan tersebut.

Perbaikannya adalah mengubah keempat kondisi kolom teks menjadi is true, sementara pengaturan lainnya tetap sama. Ulangi pengujian dalam percakapan baru dengan hanya memberikan email pada giliran kedua. Action seharusnya menunggu detail proyek yang tersisa.

Ini adalah satu percakapan yang diamati, bukan tingkat keberhasilan produksi. Reproduksi dengan percakapan baru, periksa kolom tersimpan setelah setiap giliran, dan periksa permintaan pada endpoint Anda sendiri.

Pemanggilan Action yang sebenarnya mengembalikan HTTP 201. Buka detailnya untuk memeriksa permintaan; rekaman tersimpan di bawah menunjukkan data yang disimpan penerima.

Satu rekaman yang benar-benar tersimpan dari penerima demo terautentikasi. Ini adalah permintaan penawaran, bukan penawaran atau pemesanan yang dikonfirmasi.

Demonstrasi menggunakan penerima lokal dan mencatat pengiriman HTTP yang sebenarnya. Agent Quickchat AI yang dihosting membutuhkan endpoint HTTPS yang dapat dijangkau publik; URL localhost pada komputer Anda tidak dapat dijangkau dari layanan.

Jika tidak ada yang diterima, periksa View logs pada Action dan metadata percakapan yang tersimpan. Nilai yang belum ada, Action nonaktif, dan kegagalan HTTP membutuhkan perbaikan yang berbeda. Perbaiki konfigurasi dan gunakan percakapan baru untuk menguji pemicu otomatis lagi; meminta percakapan yang sama mencoba ulang tidak mereset percobaan satu kali per percakapan.

Mengapa chatbot tidak muncul atau menampilkan pengaturan lama?

Periksa halaman yang dipublikasikan, lokasi pemasangan, dan akses Agent sebelum mengubah prompt. Masalah pemuatan browser terpisah dari masalah kualitas jawaban.

Jika browser melaporkan sumber daya diblokir, periksa kesalahan Content Security Policy atau pemblokirnya secara persis. Hindari menonaktifkan seluruh perlindungan situs. Uji halaman publik melalui HTTPS dan gunakan dokumentasi channel untuk pengaturan yang diperlukan.

Berapa biaya chatbot situs web?

Langganan dan kuota penggunaan membayar layanan AI; paket situs web dan integrasi opsional Anda memiliki biaya terpisah.

Satu kredit AI tidak sama dengan satu percakapan. Percakapan dapat memuat beberapa balasan AI, dan pilihan model yang berbeda dapat memiliki biaya kredit yang berbeda. Sertakan Preview dan Simulation dalam anggaran pengujian. Gunakan harga dan kuota terbaru serta panduan biaya chatbot untuk memperkirakan volume Anda.

Bisakah ChatGPT atau Claude membantu menyiapkan chatbot?

Koneksi pengelolaan akun Quickchat AI memungkinkan asisten yang kompatibel mengonfigurasi pengaturan Agent yang didukung dan menyiapkan pengujian dari artefak ini.

Hubungkan akun Anda sendiri melalui Quickchat AI di ChatGPT atau Quickchat AI di Claude, dengan mengikuti panduan Manage with AI. Alat yang didukung mencakup pengetahuan, Main Prompt, pembuka percakapan, Human Handoff, HTTP Actions, pengujian, dan cuplikan penerapan.

Selesaikan Smart Data Gathering dan pengaturan Appearance widget yang terperinci di dashboard. Anda juga perlu mengotorisasi akun eksternal dan memasang cuplikan di pengaturan situs web. Koneksi akun digunakan untuk mengelola Agent Anda; ini terpisah dari menyediakan Agent sebagai alat MCP.

Use the Kestrel Kitchens website-chatbot kit to prepare a separate learning Agent. Do not change existing Agents. Set its name to Kestrel Kitchens, add knowledge.txt and set main-prompt.txt as Main Prompt. Configure the supported greeting, conversation starters and Human Handoff settings from the kit. Prepare the launch-test dataset with the supplied messages and criteria. Read back the saved configuration and return this Agent's current Widget snippet.
List the remaining dashboard steps for Smart Data Gathering, Appearance and website installation. Do not invent support for those settings. Leave the optional Send quote enquiry Action inactive until I provide my receiver URL and configure its credential. Before running tests or external writes, tell me the expected credit use and effects and obtain any approval required by this client. Do not claim that a website, email or CRM delivery works until it has been tested.

Pertanyaan yang sering diajukan

Bagaimana menambahkan chatbot AI ke situs web saya?

Buat Agent di Quickchat AI, tambahkan pengetahuan bisnis Anda, konfigurasikan Main Prompt, Smart Data Gathering, dan Human Handoff, lalu pasang Widget-nya menggunakan plugin atau cuplikan yang disediakan. Uji jawaban berdasarkan sumber, detail kontak yang dikumpulkan, dan balasan staf yang diterima pada situs yang telah dipublikasikan.

Bisakah saya menambahkan ChatGPT khusus ke situs web saya?

Anda dapat menambahkan asisten bergaya ChatGPT yang dilatih dengan halaman Anda sendiri. Tutorial ini menerapkan Agent Quickchat AI melalui widget situs webnya, sehingga pengunjung dapat mengobrol di situs Anda tanpa masuk ke ChatGPT. Pengetahuan, instruksi, dan integrasinya dikelola di Quickchat AI.

Bisakah saya menambahkan chatbot AI ke situs web secara gratis?

Paket Free Quickchat AI mendukung pembelajaran pribadi nonkomersial dan mencakup 50 kredit AI per bulan. Situs web perusahaan atau penerapan penjualan dan dukungan yang berhadapan dengan pelanggan membutuhkan paket yang mengizinkan penggunaan komersial. Langganan pembuat situs web terpisah, dan pengujian juga menggunakan kredit AI.

Apakah saya perlu menulis kode atau menyediakan kunci API?

Pengaturan inti menggunakan pengaturan dashboard dan plugin, app embed, atau skrip yang disediakan. Cuplikan situs web memuat Scenario ID publik, bukan kunci API pribadi. Menghubungkan CRM Action opsional membutuhkan endpoint yang sesuai beserta autentikasinya; simpan kredensial tersebut di pengaturan Action.

Bisakah chatbot situs web mengumpulkan prospek dan permintaan penawaran?

Ya. Smart Data Gathering meminta kolom yang dipilih selama percakapan dan menyimpannya di Inbox. Email new leads dapat memberi tahu admin Agent setelah alamat email atau nomor telepon dikumpulkan. API Action dapat mengirim kolom wajib yang tersimpan ke penerima yang dikonfigurasi; nama yang dikumpulkan saja belum memastikan permintaan sudah lengkap.

Bisakah staf mengambil alih chat?

Ya. Konfigurasikan Human Handoff dengan jam kerja staf dan pesan di luar jam kerja. Di Inbox, pilih Assign to me untuk percakapan yang belum ditugaskan, atau Take over ketika kontrol tersebut ditampilkan, lalu balas pengunjung. Reassign to AI mengembalikan percakapan ke Agent.

Apakah ini berfungsi di WordPress, Shopify, Squarespace, Wix, dan Webflow?

Masing-masing memiliki jalur pemasangan. Gunakan plugin resmi WordPress, app embed Shopify setelah menghubungkan Agent tokonya, atau cuplikan footer/akhir body yang sesuai dan berlaku di seluruh situs untuk Agent yang sudah ada. Izin plugin dan persyaratan paket untuk kode khusus berbeda menurut pembuat situs.

Mengapa chatbot saya tidak muncul di situs web?

Periksa halaman yang telah dipublikasikan, Scenario ID yang benar, dan penempatan cuplikan di akhir body halaman. Hapus pemasangan ganda yang sudah usang dan hindari blok berbasis iframe untuk Widget mengambang. Jika terbuka tetapi tidak dapat menjawab, periksa Widget & Embed access dan kredit AI yang tersedia.

Apakah chatbot akan memperlambat situs web saya?

Pemuat widget diunduh secara asinkron, tetapi tetap menambahkan JavaScript dan permintaan jaringan. Bandingkan kinerja pemuatan dan interaksi sebelum dan sesudah pemasangan pada halaman yang mewakili situs dan di ponsel. Pemuatan asinkron tidak membuktikan tidak adanya dampak kinerja.

Apakah chatbot situs web berfungsi di ponsel?

Widget terbuka menggunakan tata letak layar penuh di bawah 768 piksel CSS. Uji tombol pembuka, keyboard, pengguliran, dan kontrol penutup di ponsel. Biarkan Auto-open Widget nonaktif jika pembukaan otomatis akan mengganggu penjelajahan.

Bisakah chatbot menjawab dalam bahasa pengunjung saya?

Agent dapat membalas dalam bahasa pengunjung. Penerjemahan teks sambutan tetap, pembuka percakapan, dan label widget adalah pengaturan terpisah pada paket berbayar. Uji fakta dalam jawaban maupun teks antarmuka untuk setiap bahasa yang ingin Anda dukung.