Free tool
WhatsApp Chat Button Generator
Add a floating “Chat on WhatsApp” button to your website so visitors can message you in one tap. Choose the text, colour and position, copy the code and paste it into your site.
Preview
How to add it
Add the button to your website
- 1. Create the button. Add your number, choose the text, colour and position, and check the preview.
- 2. Copy the code. Press Copy code. It is plain HTML and CSS.
- 3. Paste it into your site. Add it just before the closing
</body>tag in your template. On website builders, look for custom code, footer code or code injection. - 4. Publish and test. Open your site on a phone and tap the button to check the chat opens with your message.
Why add a WhatsApp chat button?
Many visitors would rather send a quick message than fill in a form or make a call. A button that is always visible tells them that you are on WhatsApp and gives them a one-tap way to ask a question, which is useful for product pages, price enquiries and booking requests.
Tips for a button that helps
- Write a clear pre-filled message. It tells you what the visitor wants, for example the page they were on.
- Keep the corner clear. Check that the button does not cover cookie notices, other chat widgets or important buttons.
- Use a number that someone watches. Reply quickly during your working hours.
- Tell visitors when to expect a reply. A line such as "We reply within working hours" on your contact page sets expectations.
Accessible by default
The generated button has a text label for screen readers, opens in a new tab, and automatically uses light or dark text depending on the colour you choose so that it stays readable.
Want a link or a printable code instead? Try the WhatsApp link generator or the WhatsApp QR code generator.
Is the chat button generator free?
Yes. It is free to use and there is no sign-up. The code you copy is yours to use on any website.
Will it work on WordPress, Shopify, Wix or Squarespace?
Yes, on any website that lets you add custom HTML or code to the footer. Look for options named custom code, footer code or code injection. We do not provide a plugin.
Will the button slow down my website?
No. It is a small piece of HTML and CSS with no external scripts, fonts or images.
Do you store my number or message?
No. The code is created in your browser and nothing is sent to our servers. Your number will appear in the code you paste into your own site.
Is this the official WhatsApp button?
No. It uses a simple chat icon and the words you choose, so it does not use the WhatsApp logo. The link it opens is a normal WhatsApp click-to-chat link.
Can I show the button on the left side?
Yes. Choose bottom left or bottom right before you copy the code.
Chats are the start
Beta Sender helps you follow up with the customers who message you, from Windows, the cloud or the Official API.