How to Add a WhatsApp Chat Button to Your Website (2026)
Part of WhatsApp for Business: The Complete Guide

Your website gets visitors — but a contact form feels like homework and most people won't fill it in. A WhatsApp button turns that friction into a one-tap conversation on the app they already use every day. Add one and you'll capture enquiries you were quietly losing.
Here's how to add a WhatsApp button to your website, from the simplest link to a floating chat widget, with copy-paste code — and then the part most guides skip: what to do when the enquiries start arriving at 11:47pm.
Why a WhatsApp button beats a contact form
Forms ask people to type their email, wait for a reply, and hope you respond. A WhatsApp button lets them message you like they'd message a friend — instantly, on a channel they check constantly. The result:
- More enquiries — one tap versus a multi-field form.
- Faster conversations — real-time chat, not email tag.
- A saved contact — you keep their number for follow-up (with consent).
For most small businesses, adding a WhatsApp button lifts enquiries noticeably, especially on mobile.
The foundation: the click-to-chat link
Every WhatsApp button is built on the same thing — a click-to-chat link:
https://wa.me/<number>
Where <number> is your WhatsApp number in full international format with no plus sign, spaces, or dashes. For example, a UK number +44 7911 123456 becomes:
https://wa.me/447911123456
You can pre-fill a message so the customer starts with context:
https://wa.me/447911123456?text=Hi!%20I%20have%20a%20question%20about...
(Spaces are written as %20.) That single URL is what every button, link, and widget points to. We cover it in depth in our click-to-chat link guide.
Option 1: A simple text or button link
The quickest button is an HTML link styled as a button:
<a href="https://wa.me/447911123456?text=Hi!%20I'd%20like%20to%20ask..."
target="_blank" rel="noopener"
style="display:inline-block;background:#25D366;color:#fff;
padding:12px 20px;border-radius:8px;text-decoration:none;
font-weight:600;font-family:sans-serif">
Chat on WhatsApp
</a>
Paste that anywhere in your page's HTML and you have a working WhatsApp button. Swap in your number and message. (Use WhatsApp's green #25D366 sparingly and describe it as "WhatsApp" — don't imply an official partnership.)
Option 2: A floating chat bubble
The classic bottom-corner bubble that follows the visitor as they scroll. Minimal version:
<a href="https://wa.me/447911123456"
target="_blank" rel="noopener" aria-label="Chat on WhatsApp"
style="position:fixed;bottom:20px;right:20px;z-index:9999;
background:#25D366;width:56px;height:56px;border-radius:50%;
display:flex;align-items:center;justify-content:center;
box-shadow:0 4px 12px rgba(0,0,0,.2)">
<svg width="30" height="30" viewBox="0 0 24 24" fill="#fff"><path d="M12 2a10 10 0 0 0-8.6 15l-1.4 5 5.1-1.3A10 10 0 1 0 12 2zm5.8 14.2c-.2.7-1.4 1.3-2 1.4-.5.1-1.2.1-1.9-.1-3.3-1-5.4-4.4-5.6-4.6-.2-.2-1.3-1.7-1.3-3.3s.8-2.3 1.1-2.6c.3-.3.6-.4.8-.4h.6c.2 0 .5 0 .7.5l.9 2.1c.1.2.1.4 0 .6l-.4.6c-.1.2-.3.3-.1.6.5.9 1.1 1.5 1.8 2 .4.3.7.4.9.1l.6-.8c.2-.3.4-.2.7-.1l2 1c.3.1.4.2.5.3.1.3.1.9-.1 1.6z"/></svg>
</a>
Drop it just before your closing </body> tag and it appears on every page.
Option 3: Your website builder's WhatsApp element
If you use a builder, you don't need code at all:
- Shopify — add a free WhatsApp chat app from the app store, or a button block linking to your
wa.meURL. - WordPress — install a WhatsApp button plugin, or add the snippet above in a Custom HTML block.
- Wix / Squarespace — use the built-in WhatsApp chat element or a button linked to your
wa.meURL.
They all wrap the same click-to-chat link in a friendlier editor.
Make your button actually convert
A button only helps if the conversation on the other side is good:
- Set expectations. Pair it with a greeting message so visitors get an instant, warm reply.
- Pre-fill helpful context with
?text=so you know what page they came from. - Put it where intent is high — near prices, product details, and your contact page.
- Answer fast. A button that leads to a slow reply wastes the click.
The part nobody plans for: the button works
That last bullet deserves more than a bullet, because it's the one that decides whether any of this was worth doing.
A contact form protects you. It's slow and it's a chore, so it filters out everyone who isn't already determined. You get a handful of enquiries a week and you can comfortably answer all of them. A WhatsApp button removes that filter — deliberately. Now the person half-reading your prices on her phone at 11:47pm on a Tuesday can ask you a question with one thumb.
And she does. Then this happens:
11:47pm — she taps the button on your prices page. WhatsApp opens with "Hi! I have a question about…" already typed.
11:47pm — she finishes it: "how much for a 3-bed deep clean, and can you do Saturday?"
11:48pm–11:58pm — nothing. You're asleep, which is a reasonable thing to be at midnight.
11:58pm — she messages two other cleaners with WhatsApp buttons. One of them answers.
7:30am — you reply: "Morning! A 3-bed deep clean is $180 and yes, Saturday's free." Correct, friendly, eleven hours late.
That was a $180 job, and you lost it in the eleven minutes you were unconscious.
Here's the uncomfortable part: the better your button performs, the worse this gets. Evenings and weekends aren't the edge case for a small business — they're exactly when your customers are free to think about hiring you. Moving the button next to your prices, adding the floating bubble, pre-filling the message: every one of those improvements sends more people into a channel where the reply time is "whenever I next pick up my phone".
A button that captures more enquiries while your response time stays the same doesn't produce more bookings. It produces a longer list of people who already booked someone else.
What answering actually takes
Be honest about the requirement before you go shopping for a solution. To convert those 11:47pm taps you need something that is:
- Awake — every night, every Sunday, every time you're on a job with your hands full.
- Accurate — it knows a 3-bed deep clean is $180 and that you don't cover that suburb.
- Fast — minutes, not hours. The comparison window is short.
- Speaking their language — if a good share of your visitors write in Spanish, a reply in English at 7:30am is losing twice.
Hiring for that is a receptionist service, and those run roughly $109 to $300 a month (Ruby around $235, Smith.ai around $300) — hard to justify against a $180 job.
An AI receptionist on the other end of the button covers the same four requirements for a lot less. It reads the message the moment it lands, answers with your real prices and availability, handles voice notes if they'd rather talk than type, replies in whatever language they wrote in, and takes the booking details so there's a request waiting on your phone in the morning instead of a missed enquiry. ChatMunshi does this from $19 a month, flat, with the AI included and no per-message charges — see the pricing page for what's in each plan.
Make ?text= do some work
One practical tip that pays off once something is actually reading the messages. The pre-filled text isn't just a note to you — it's the first thing the receptionist sees, so make it carry context:
https://wa.me/447911123456?text=Hi!%20I'm%20asking%20about%20the%203-bed%20deep%20clean
Put a different pre-fill on each service page and every conversation starts with the customer's intent already established, instead of "hi" and three rounds of narrowing down. Add a QR code on your van or shop window with the same idea and you've covered online and offline.
The takeaway
Adding a WhatsApp button is easy: build a wa.me click-to-chat link with your number in international format, then wrap it in a styled link, a floating bubble, or your website builder's WhatsApp element. It beats a contact form for capturing enquiries — especially on mobile.
The part that decides whether it makes you money is what happens next. A button is a promise that someone's there. Make sure something actually is, because the visitor who taps it at midnight is comparing you against whoever answers first — and she'll have that answer before you wake up.
Frequently asked questions
How do I add a WhatsApp button to my website?
The simplest way is a click-to-chat link: link a button to https://wa.me/<your number in international format>. For a floating chat bubble in the corner, add a small HTML/CSS snippet or use your website builder's WhatsApp widget. Both open a WhatsApp chat with your business when clicked.
What is the WhatsApp click-to-chat link format?
It's https://wa.me/<number>, where the number is in full international format with no plus sign, spaces, or dashes — for example https://wa.me/447911123456. You can add a pre-filled message with ?text=, e.g. https://wa.me/447911123456?text=Hi%20there.
Can I add a WhatsApp button on Shopify, WordPress, or Wix?
Yes. All major website builders support it — either through a built-in WhatsApp element, a free plugin/app, or by pasting a small code snippet into your theme. The underlying link is the same wa.me click-to-chat URL.
Does a WhatsApp button work on mobile and desktop?
Yes. On mobile it opens the WhatsApp app; on desktop it opens WhatsApp Web or the desktop app. The same wa.me link handles both automatically.
Who answers the messages my WhatsApp button generates at night?
By default, nobody — the enquiries queue up until you next open your phone, and most people comparing suppliers will have booked elsewhere by then. An AI receptionist connected to your WhatsApp number answers instantly with your real prices and availability, in the customer's own language, and leaves the booking request waiting for you in the morning. ChatMunshi does this from $19 a month with the AI included.