Free WhatsApp Chat Button Generator for Websites
Create a custom WhatsApp button, add your number and welcome message, then copy HTML code you can paste into WordPress, Shopify, Wix, Webflow, or any website.
Include country code without + sign, such as 1 for the US or 44 for the UK.
Your button will appear like this on your website:
How to add a WhatsApp chat button to your website
A WhatsApp chat button gives website visitors a direct way to start a conversation without searching for your number or saving a contact. Generate the button above, copy the HTML snippet, and paste it into the shared area of your website so it appears on the pages where visitors are most likely to ask questions.
WordPress
Paste the generated code into a custom HTML block, a footer widget, or a header and footer code plugin. If your theme has a global footer area, add it there so the button appears across the site.
Shopify
Open your theme customizer or edit the theme footer file, then paste the HTML before the closing body tag. Test it on product and cart pages so the button does not cover checkout controls.
Wix and Squarespace
Use the platform's embed or custom code option and place the snippet site-wide. Keep the bottom spacing high enough to avoid overlapping cookie banners, chat bubbles, or mobile navigation.
Webflow, React, Next.js, or plain HTML
Add the snippet near the end of the page body or inside a shared layout component. The button is fixed-position, so one shared placement is usually enough for the whole website.
Why use a WhatsApp button?
Website forms are still useful, but many buyers want a faster path to a real conversation. A WhatsApp button is especially useful for local services, clinics, ecommerce stores, agencies, restaurants, real estate teams, and support teams that already handle customer questions on WhatsApp.
- Give visitors a one-click path from your website to a WhatsApp conversation.
- Pre-fill the first message so your team knows what the visitor wants.
- Match the button color, text, corner radius, and screen position to your brand.
- Start with a lightweight HTML button before moving to a full WhatsApp inbox or automation workflow.
WhatsApp button vs WhatsApp inbox
A free WhatsApp button is the fastest way to turn website visitors into conversations. It works well when one person can answer messages from one phone number. As volume grows, teams usually need assignments, saved replies, automation, templates, customer history, and reporting.
OnSync is built for that next step: a shared team inbox for WhatsApp, Instagram, Facebook, and Telegram with AI automation and team collaboration. Start with the button, then connect the full workflow when conversations become too important to manage from one device.
WhatsApp chat button FAQ
Is this WhatsApp chat button generator free?
Yes. You can generate and copy the WhatsApp chat button HTML code for free without creating an OnSync account.
Can I add the WhatsApp button to WordPress?
Yes. Copy the generated HTML code and paste it into a custom HTML block, your theme footer, or a trusted header and footer plugin.
Can I use this button on Shopify, Wix, Webflow, or Squarespace?
Yes. The generated snippet uses standard HTML and inline CSS, so it can be added to most website builders that support custom code blocks or footer code.
Do visitors need to save my number before messaging?
No. The button uses WhatsApp click-to-chat links, so visitors can open a conversation with your business directly.
Can I track WhatsApp button clicks in Google Analytics?
Yes. Turn on the Google Analytics option to include a click event in the generated code. Your site must already have gtag installed.
Do I need the WhatsApp Business API for this button?
No. A simple chat button can open any valid WhatsApp number. The WhatsApp Business API is useful later when you need team inboxes, automation, templates, and reporting.
Need more than a button?
Manage WhatsApp conversations, assignments, automations, templates, and follow-up from one shared team inbox.
Start Free Trial