WAButton

Webflow Approved

Seamless WhatsApp Widget for Webflow Sites

Deliver a pixel-perfect WhatsApp chat experience for client projects and SaaS marketing pages. High aesthetic polish and complete styling control.

2 min setup Target: Project Settings -> Custom Code -> Footer Code

Step-by-step installation for Webflow

Follow these steps to embed WAButton on your Webflow site. No complex development or app fees.

  1. 1

    Open Webflow Project Settings

    Open your project in Webflow. Go to Project Settings -> Custom Code.

    Pro tip: You can also add custom code to specific individual pages in Webflow page settings if desired.

  2. 2

    Paste in Footer Code

    Scroll to "Footer Code" (Before </body> tag) and paste your snippet.

    Pro tip: WAButton uses Shadow DOM encapsulation so your Webflow class names and CSS grid remain intact.

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

    Publish Site

    Click Save Changes, then hit Publish to publish to your custom domain.

    Pro tip: Publish to both the staging domain and production domain to test before client sign-off.

Why store owners and agencies choose WAButton for Webflow

Designer Aesthetic

Sleek typography, subtle drop shadows, and high-fidelity micro-interactions.

Agency Client Handoff

Share interactive live widget previews with clients before deploying.

Zero Layout Shift

Floating shadow DOM architecture prevents style bleed into your Webflow classes.

Frequently asked questions

Will WAButton styles interfere with my Webflow CSS classes?

No. WAButton is encapsulated in its own isolated namespace and shadow-root architecture, so your Webflow styles remain completely pristine.

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.

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