Add a chat button to your website

A floating WhatsApp button in the corner of your site. Visitors click it and a chat opens with your number, message ready to send.

You do not need to be technical to do this. It is one block of text pasted into your site once.

Steps

1. Open Website widget and add a widget.
2. Pick the WhatsApp number it opens.
3. Give it a name — internal, so you can tell widgets apart if you run more than one site.
4. Write the greeting bubble — the small message that appears beside the button.
5. Write the pre-filled message — what is typed into the customer's box when they click.
6. Choose the button colour and whether it sits bottom left or bottom right.
7. Save, and copy the snippet.
8. Paste the snippet into your website.

Where to paste it

You want it just before the closing </body> tag, on every page.

• WordPress — Appearance → Theme File Editor → footer.php, before </body>. Easier: any "insert header and footer scripts" plugin has a footer box; paste it there.
• Shopify — Online Store → Themes → Edit code → theme.liquid, before </body>.
• Wix / Squarespace / Webflow — look for "custom code" or "code injection" in settings, and use the footer or end-of-body option.
• A developer built your site — send them the snippet and this sentence: "before the closing body tag, site-wide."

Setting it up well

• The greeting bubble is the hook. "Questions? Chat with us" outperforms an unlabelled green circle by a wide margin.
• Match the pre-filled message to the page if you can run more than one widget — a product page asking about that product beats a generic hello.
• Bottom right is the convention. Move it left only if something else already lives there.
• Match your brand colour, unless your site is already green-heavy, in which case a contrasting colour gets noticed more.

What happens when someone clicks

On a phone, WhatsApp opens. On a desktop, WhatsApp Web or the desktop app opens. Either way the conversation lands in your Chatbox as soon as they send.

Because the customer started it, the 24-hour window is open and your replies are free.

If something goes wrong

• The button does not appear. The snippet went into the header instead of before </body>, or the page is cached. Clear your site's cache and hard-refresh.
• It appears on one page only. It was pasted into a single page rather than the site-wide footer.
• Clicking does nothing on desktop. The visitor has no WhatsApp Web session. Normal — it works on their phone.
• It overlaps something else in the corner. Switch it to the other side.
• You changed a setting and nothing changed. Caching again. Give it a few minutes and hard-refresh.

Next

Build an opt-in page.