Menambahkan tombol chat WhatsApp ke situs HTML apa pun

Buat widgetnya di sini, salin satu blok HTML, lalu tempel ke situs HTML apa pun. Tidak ada plugin yang perlu dipasang, tidak ada biaya bulanan, dan tidak ada skrip yang dimuat dari server orang lain.

Buka pembuat lengkap

Menambahkannya ke situs HTML apa pun

Buka berkas HTML halaman Anda, atau template bersama yang dipakai setiap halaman.
Tempel kodenya tepat sebelum tag </body>.
Unggah berkasnya dan muat ulang situs Anda.
Pada Content-Security-Policy yang ketat, pindahkan blok <style> dan <script> ke berkas tersendiri lalu rujuk berkas itu alih-alih menuliskannya inline.

Kenapa bukan plugin?

Plugin chat berbasis layanan menambah satu permintaan pihak ketiga di setiap pemuatan halaman, bisa mengubah desainnya sendiri tanpa memberi tahu Anda, dan biasanya mulai meminta langganan begitu trafik Anda bertumbuh. Kode yang Anda buat di sini adalah HTML, CSS, dan JavaScript biasa yang tinggal di template Anda sendiri — sekitar 11 KB, tanpa permintaan eksternal, dan tanpa peta jalan orang lain.

Sebelum menempel

Buat dulu widgetnya di pembuat lengkap dan gunakan «Unduh halaman uji» untuk memastikan tampilannya benar. Lalu salin kodenya dan ikuti langkah di atas — tempel sekali saja, ke template yang dipakai bersama semua halaman, bukan satu per satu di tiap halaman.

Pertanyaan yang sering diajukan

Apakah widget chat memperlambat situs saya?

Ia menambah sekitar 11 KB HTML, CSS, dan JavaScript inline dan tidak melakukan permintaan jaringan sama sekali, jadi tidak ada unduhan terpisah dan tidak bisa memblokir rendering. Widget chat berbasis layanan biasanya memuat 100 KB atau lebih dari pihak ketiga.

Apakah widgetnya aksesibel?

Kontaknya adalah tautan sungguhan, jadi berfungsi tanpa JavaScript dan dengan pembaca layar. Tombolnya melaporkan statusnya, panelnya bisa ditutup dengan Escape, fokus masuk lalu kembali keluar, setiap target minimal 44 piksel, dan animasi dilewati bila pengunjung meminta gerakan minimal.