# How to Add WhatsApp Chat to Your Website (Button, Link or Widget) > The quickest way to add WhatsApp to your website is a wa.me link with your number in international format, such as wa.me/2547XXXXXXXX, placed on a button. For a better experience, use a live chat widget that answers visitors on the page and lets them continue on WhatsApp with one tap, so your team answers everything from one shared inbox. Source: https://chat.or.ke/blog/how-to-add-whatsapp-chat-to-website Published: 2026-10-20 | Updated: 2026-10-20 | Publisher: chat.or.ke Kenyan customers would rather send a WhatsApp message than fill in a contact form, so putting WhatsApp on your website is one of the cheapest ways to get more enquiries. The question is how to do it well, because a link that opens the wrong number or a blank chat loses people fast. This step-by-step guide covers the three common methods: a plain wa.me link, a floating WhatsApp button, and a live chat widget that hands visitors over to WhatsApp. You do not need to be a developer for any of them. ## Key takeaways - A wa.me link uses your full number with the country code and no plus sign, zero or spaces: wa.me/2547XXXXXXXX. - Add a pre-filled message so you know which page or product the visitor was looking at. - Place the button where people decide: product pages, pricing, booking and contact pages, plus a floating button on mobile. - If several people answer, or visitors browse on laptops, pair WhatsApp with a live chat widget and a shared inbox. ## Before you start Gather these first so the setup takes minutes, not an afternoon: - **The WhatsApp number customers should reach.** Ideally a dedicated business line, not someone's personal phone. - **Access to edit your website**, such as your WordPress admin, Wix editor or Shopify theme, or a web developer who can paste a snippet. - **A short greeting or away message** on that number, so people who message after hours get a reply. Our guide to [WhatsApp auto-replies](https://chat.or.ke/blog/how-to-set-up-whatsapp-auto-reply) explains the options. - **A decision on who answers.** One person on the WhatsApp Business app, or a team on a shared inbox through the WhatsApp Business API. ## Step 1: Build your wa.me link A wa.me link opens a WhatsApp chat with your number on any phone or computer. Write your number in full international format with no plus sign, no leading zero and no spaces or dashes. For a Safaricom number 0712 345 678, the link is: `https://wa.me/254712345678` Common mistakes that break the link: | Wrong | Why it fails | Right | |---|---|---| | wa.me/0712345678 | Missing country code | wa.me/254712345678 | | wa.me/+254712345678 | Plus sign not allowed | wa.me/254712345678 | | wa.me/254 712 345 678 | Spaces break the link | wa.me/254712345678 | | wa.me/2540712345678 | Extra zero after 254 | wa.me/254712345678 | Test the link on your own phone before you publish it. ## Step 2: Add a pre-filled message Add `?text=` and a message to the end of the link so the visitor starts with useful context. Spaces become `%20`, though most website builders encode the text for you. For example, on a Nairobi boutique's product page for an Ankara dress: `https://wa.me/254712345678?text=Hi%2C%20I%27m%20interested%20in%20the%20Ankara%20maxi%20dress` Your team now knows exactly what the customer saw. Use a different pre-filled message on each key page, such as "I'd like to book a room" on a hotel's rooms page, so you can tell which pages bring enquiries. ## Step 3: Place WhatsApp buttons where customers decide Put the link on a clear button with the WhatsApp icon and a specific label, such as "Ask about this item on WhatsApp", rather than "Contact". Good places include: - Product and service pages, next to the price - The pricing or booking page - The contact page, alongside your phone number and map - The header or footer on mobile On most builders you add a button block and paste the link. In WordPress, use the Button block in the editor; in Wix and Shopify, add a button and set its link. ## Step 4: Add a floating button for mobile visitors A floating WhatsApp button stays in the corner of the screen as visitors scroll, which suits phone users. You can add one with a small snippet in your site's footer, a builder app, or a WordPress plugin. Keep it small, make sure it does not cover your "Add to cart" or "Book now" button, and do not use a pop-up that hides the page as soon as it loads. A floating button only works if someone is ready to answer quickly. ## Step 5: Use a live chat widget that hands over to WhatsApp For many businesses the better option is a live chat widget that answers on the page and lets the visitor continue on WhatsApp. This fixes the two weak spots of a plain button: laptop visitors who do not have WhatsApp Web open, and visitors who message after hours and get silence. With chat.or.ke's [website live chat](https://chat.or.ke/features/live-chat), you paste one line of code (or install the WordPress plugin) and a chat bubble appears. A bot or the AI assistant replies at once, quick-reply buttons cover prices, opening hours and orders, and visitors can move the chat to WhatsApp with one tap. Your team keeps the full history in one thread, and when nobody is online visitors leave their details or continue on WhatsApp. You also see who is on your site right now, which page they are reading and where they came from. Read [live chat vs WhatsApp for your website](https://chat.or.ke/blog/live-chat-vs-whatsapp-for-website) for a fuller comparison. ## Step 6: Make sure someone answers, and fast Adding WhatsApp to your site is easy; replying quickly is the real work. Decide who covers which hours, and set expectations in your greeting. If one phone is being passed around the office, move to a [shared WhatsApp inbox](https://chat.or.ke/features/whatsapp-inbox). Several agents can then reply from the same number on their own computers, with chats assigned so two people do not answer the same customer. chat.or.ke connects your official WhatsApp Business number for you, so there is no Meta API setup on your side. Customer messages are free, and replies within the 24-hour customer service window cost KES 0.75 each from a prepaid M-Pesa wallet, with no monthly fee (see [pricing](https://chat.or.ke/pricing)). ## How do you track WhatsApp enquiries from your website? Use a different pre-filled message for each page or campaign, and count them weekly. If you run Google Analytics, you can also track clicks on the WhatsApp button as an event. A live chat widget gives you more: the page each visitor started on, where they came from and how many times they have visited, plus reports on chat volume and response times. ## Frequently asked questions ### How do I create a WhatsApp link for my business? Write your number in international format without a plus sign, zero or spaces, and add it after wa.me. For the Kenyan number 0712 345 678 the link is wa.me/254712345678. You can add a ready-made message with ?text= followed by your words. ### Is it free to add WhatsApp to a website? Yes. A wa.me link or button costs nothing to add. You pay only if you use a paid tool, such as the WhatsApp Business API for several agents or a live chat platform. ### Why does my WhatsApp link open the wrong chat or show an error? Usually the number is in the wrong format. Remove the plus sign, the leading zero and any spaces, and make sure the number starts with 254 and is active on WhatsApp. ### Can several staff answer WhatsApp chats from my website? Not easily on the free WhatsApp Business app. With the WhatsApp Business API and a shared inbox, several agents can reply from the same number on their own computers, with chats assigned to each person. ### Should I use a WhatsApp button or live chat on my website? Use a WhatsApp button if your visitors are mostly on phones and one person answers. Use live chat with a WhatsApp handover if visitors browse on laptops, you want instant answers after hours, or several people reply.