Does WAButton work with Single Page Apps (SPAs) like React, Next.js, or Vue?

Yes! WAButton initializes on the window object and persists across client-side router navigation without needing to re-execute on every route change.

Will WAButton slow down my Google Lighthouse or PageSpeed Insights score?

No. The loader is less than 2KB gzipped, executes asynchronously, and connects to Cloudflare's global anycast edge with sub-10ms delivery.

Universal 1-Line Embed

Universal WhatsApp Button for Any Website or Web App

Embed WAButton on plain HTML, React, Next.js, Vue, Angular, Astro, PHP, Laravel, or any custom tech stack in under 60 seconds. High performance, shadow DOM, zero CSS conflicts.

Build My Button Free

1 min setup Target: index.html (before </body>) or root layout component

Step-by-step installation for HTML & Custom Websites

Follow these steps to embed WAButton on your HTML & Custom Websites site. No complex development or app fees.

1

Copy Your Embed Snippet

Copy your unique script snippet from your WAButton widget dashboard or onboarding screen.

Pro tip: Ensure you keep the async attribute enabled for non-blocking asynchronous browser loading.
2
Paste Before the Closing </body> Tag

Paste the code into your root HTML file (e.g. index.html) or root layout component (e.g. layout.tsx, App.vue, base.blade.php) right before </body>.

Pro tip: Placing the script right before </body> ensures your page content paints first without waiting on third-party scripts.
```
<script src="https://widget.wabutton.app/v1.js" data-widget-id="YOUR_WIDGET_ID" async></script>
```
3

Open in Browser

Save the file and refresh your browser. Your floating WhatsApp button will appear immediately in the bottom corner.

Why store owners and agencies choose WAButton for HTML & Custom Websites

One Universal Script Tag

A single 2KB async loader that operates identically across static HTML, SSR, and SPA frameworks.

Shadow DOM Encapsulation

Strict CSS scoping prevents styling bleed into your Tailwind, Bootstrap, or custom CSS classes.

Zero External Dependencies

Built in vanilla TypeScript without jQuery, React runtime bloat, or external icon fonts.

SPA Navigation Aware

Automatically maintains widget state across client-side route transitions (React Router, Next.js, Vue Router).

Frequently asked questions

Does WAButton work with Single Page Apps (SPAs) like React, Next.js, or Vue?: Yes! WAButton initializes on the window object and persists across client-side router navigation without needing to re-execute on every route change.
Will WAButton slow down my Google Lighthouse or PageSpeed Insights score?: No. The loader is less than 2KB gzipped, executes asynchronously, and connects to Cloudflare's global anycast edge with sub-10ms delivery.

More installation guides

Tomorrow's conversations are already visiting your website today.

The opportunity isn't only getting more visitors. It's connecting with the ones you already have, before their interest fades.

Build My Button Free Preview Demo Again

One line of code. No credit card. No waiting.