To add WhatsApp to your website, create a click-to-chat link in the format https://wa.me/91XXXXXXXXXX?text=… with your number and a prefilled message, place it as a visible button near every call to action and as a small floating button on mobile, and track clicks in Google Analytics. That is the whole technical job, and it is free. The part most businesses get wrong is everything around it: no prefilled message, the button hidden in the footer, and nobody replying fast enough.
It is also the most skipped fix on Indian business websites. In our audit of 1,452 Indian business websites, 79% had no WhatsApp link at all, even though that is where most of their customers would rather talk.
The click-to-chat link, explained
WhatsApp’s official click-to-chat format is:
https://wa.me/919876543210?text=Hi%2C%20I%20want%20a%20quote%20for%20a%20website
- Number: country code 91 followed by the 10-digit mobile number. No plus sign, no zero, no spaces or dashes.
- Text: the message that appears pre-typed in the visitor’s chat box. It must be URL-encoded: spaces become %20, commas %2C.
- Behaviour: on a phone it opens the WhatsApp app; on a desktop it opens WhatsApp Web or the desktop app.
Where to put the button
| Placement | Why | Prefilled message idea |
|---|---|---|
| Hero section, next to the main button | Most mobile visitors decide within the first screen | Hi, I’d like to know more about [service] |
| Every service or product page | Intent is highest where the details are | Hi, I’m interested in [service name]. What’s the price? |
| Pricing page | Price questions are the most common chat | Hi, I have a question about the [plan] plan |
| Floating button on mobile | Always reachable while scrolling | Hi, I found you on your website |
| Contact page, above the form | Offers a faster route than the form | Hi, I’d like to talk to your team |
A different prefilled message per page does two jobs: the visitor does not have to think about what to type, and your team knows which page the lead came from the moment the chat opens.
Step by step on WordPress, Shopify and custom sites
- Decide the number. Use the business number that someone actually monitors, not the owner’s personal phone.
- Write the prefilled messages for each key page, and encode them. Any online URL encoder will do.
- Add the buttons. On WordPress, a button block with the wa.me link is enough; most page builders have a button widget. On Shopify, add it to the theme’s product and contact templates. On custom sites, it is a normal anchor tag.
- Add a floating button for mobile, bottom right, clear of the cookie banner and other widgets, at least 48 pixels tall so it is easy to tap.
- Track clicks in Google Analytics 4 as an event. Our GA4 setup guide covers event tracking.
- Test on a real phone: iPhone and Android, with WhatsApp installed, and on a desktop without it.
Plugin or plain link?
Plugins add chat bubbles, agent photos and working-hours logic. Some are light; some load large scripts on every page. A plain link styled as a button with an inline SVG icon adds effectively nothing to load time. Unless you need rotation between several agents, the plain link is usually the better choice. Whatever you choose, check speed before and after with the method in our Core Web Vitals guide.
The mistakes that waste the button
- Wrong number format. A leading zero or a missing 91 opens an error screen.
- No prefilled text. The visitor sees an empty chat box and often closes it.
- Button only in the footer. Most mobile visitors never scroll that far.
- Floating button covering content, such as the Add to cart button or the cookie banner’s Accept.
- Nobody answers. A WhatsApp enquiry that waits four hours is a lead that asked your competitor too. Set a greeting and an away message with real hours.
After the click: replying at speed
The button is only the door. The sale depends on the reply. A few rules that make the difference:
- Reply within minutes during working hours. Speed matters more than a perfect answer.
- Keep quick replies ready for price, location, timelines and payment.
- Ask one qualifying question early: budget, city, or timeline.
- Log every lead somewhere, even a sheet, so follow-ups do not depend on memory.
When the volume grows past what one phone can handle, a WhatsApp CRM with a shared inbox is the next step. Our WhatsApp CRM page explains how teams handle this with ZupiChat.
Frequently Asked Questions
Is a WhatsApp button on my website free?
Yes. A click-to-chat link using wa.me and your number costs nothing and works with the free WhatsApp Business app. You only pay if you move to the WhatsApp Business API for a shared team inbox, automation or campaigns.
Should the WhatsApp button replace my contact form?
For most Indian small businesses, WhatsApp should be the primary action and the form a secondary option for people who prefer email. Keep the form short, because some visitors, especially B2B buyers at work, will not open WhatsApp from a desktop.
Will a floating WhatsApp widget slow down my website?
Heavy third-party chat widgets can add noticeable load time. A plain link styled as a button, with an inline SVG icon, adds almost nothing. If you use a plugin, check your page speed before and after installing it.
How do I know how many leads came from the WhatsApp button?
Track clicks on the button as an event in Google Analytics 4, and use a distinct prefilled message per page so the chats themselves tell you where the visitor came from. Together they show clicks and actual conversations.
Can I use one WhatsApp number for several staff members?
The free app supports a limited number of linked devices on one number. For a team handling many chats, the WhatsApp Business API with a shared inbox lets several people answer from the same number with assignment and history.
Want us to set up WhatsApp buttons, tracking and quick replies on your website?
