WAButton

Benam universal 1 baris

Butang WhatsApp untuk HTML & Custom Websites

Tambah butang WhatsApp terapung pada laman web HTML & Custom Websites Anda. Pilih ucapan dan biar pelawat menghantar mesej ke nombor perniagaan Anda.

Cipta butang percuma saya

Pemasangan 1 minit Sasaran: index.html (before </body>) or root layout component

Pemasangan langkah demi langkah untuk HTML & Custom Websites

Ikut langkah ini untuk menambah kod pemasangan WAButton pada laman web HTML & Custom Websites Anda.

  1. 1

    Salin coretan benam Anda

    Salin coretan skrip unik Anda dari papan pemuka widget WAButton atau skrin onboarding.

    Petua pro: Pastikan atribut async kekal aktif supaya pelayar memuatkannya secara async tanpa menyekat.

  2. 2

    Tampal sebelum teg penutup </body>

    Tampal kod ke dalam fail HTML akar Anda (cth. index.html) atau komponen layout akar (cth. layout.tsx, App.vue, base.blade.php) tepat sebelum </body>.

    Petua pro: Meletakkan skrip tepat sebelum </body> membolehkan kandungan halaman Anda dimuatkan dahulu. 

    <script src="https://widget.wabutton.app/v1.js" data-widget-id="YOUR_WIDGET_ID" async></script>
  3. 3

    Buka dalam pelayar

    Simpan fail dan muat semula pelayar Anda. Butang WhatsApp terapung Anda akan muncul serta-merta di sudut bawah.

Mengapa pemilik kedai dan agensi memilih WAButton untuk HTML & Custom Websites

Satu teg skrip universal

Satu pemuat async yang sangat kecil dan berfungsi sama di HTML statik, SSR dan rangka kerja SPA.

Gaya berskop

Setiap gaya diskopkan kepada nama kelas berawalan wabutton, jadi ia tidak mengubah gaya kelas Tailwind, Bootstrap atau CSS tersuai Anda.

Skrip serba lengkap

Dibina dengan Preact dan dihantar di dalam skrip itu sendiri, jadi halaman Anda tidak memerlukan jQuery, React atau fon ikon.

Peka navigasi SPA

Mengekalkan keadaan widget secara automatik merentas peralihan laluan di sisi klien (React Router, Next.js, Vue Router).

Soalan lazim

Adakah WAButton berfungsi dengan Single Page Apps (SPA) seperti React, Next.js atau Vue?

Ya! WAButton dimulakan pada objek window dan kekal merentas navigasi penghala sisi klien tanpa perlu dijalankan semula pada setiap pertukaran laluan.

Adakah WAButton akan menurunkan skor Google Lighthouse atau PageSpeed Insights saya?

WAButton ialah skrip async di bawah 40KB (selepas gzip) yang dihantar dari rangkaian edge Cloudflare, jadi ia tidak menyekat paparan pertama. Panel sembang hanya dimuatkan apabila pelawat membukanya. Kesannya pada skor Anda sendiri bergantung pada laman Anda, jadi jalankan PageSpeed Insights sebelum dan selepas Anda menambahnya.

Alat Percuma Berkaitan

Cipta pautan WhatsApp, kod QR dan mesej untuk perniagaan Anda.

Lagi panduan pemasangan

Tambah WhatsApp pada .

Beri pelawat cara untuk bertanya tentang produk, harga atau ketersediaan Anda. Balas daripada WhatsApp yang sudah Anda gunakan.

Cipta butang percuma saya Pratonton butang Anda

Pelan percuma tersedia. Tiada kad kredit diperlukan.