Build & style your button
Enter your WhatsApp number and tweak the text, color and position. The preview and the code below update instantly.
International format with country code, without “+” and without 0.
Already sits in the input field when the visitor opens it.
Live preview · click the button in the corner
Embed
Copy the snippet and paste it right before the closing
</body> – or into the „Custom Code / HTML“ field of your
site builder. Works in WordPress, Wix, Jimdo, Shopify, Webflow, Squarespace or plain HTML.
The script version attaches the floating button to
your page automatically – it’s the simplest option. The HTML element
version gives you full control: load the script once, then drop in the
<whatsapp-button> as often / as dynamically as you like.
How it works
- Set it upEnter your number and tweak the text, color and position above – the preview shows instantly how the button looks on your page.
- Paste it inCopy the single line of code and drop it before the
</body>of your website. - Start chattingVisitors tap the button and land straight in your WhatsApp – with the message pre-filled. Done.
Why this widget
Zero hassle
One line of code, no account, no server, no API keys. Runs entirely in the visitor’s browser.
A real chat card
Authentic WhatsApp look with avatar, online status and a greeting – instead of just a bare button.
Isolated & robust
Shadow-DOM encapsulates every style – no conflict with your theme, no layout surprises.
Accessible
Keyboard control, ESC closes it, focus rings and “reduced motion” are respected.
Perfect on mobile
Opens the WhatsApp app on phones, WhatsApp Web on desktop – pre-filled message included.
Entirely your style
Color, position, label, light/dark and behavior are all yours to choose – a fit for any brand.
Frequently asked questions
Do I need a WhatsApp Business account?
No. A regular WhatsApp number is all it takes. The button simply opens a chat to that
number via the official wa.me link.
What format do I enter the number in?
In international format with the country code, without „+“, without spaces and without the
leading 0. Example for Germany: 0170 1234567 becomes
491701234567. Feel free to add spaces for readability – they’re
removed automatically.
Are there any costs or tracking?
No. The widget is free, loads no trackers and sets no cookies. It only talks to WhatsApp when the visitor taps the button.
Does it work in WordPress, Wix & co.?
Yes. Anywhere you can add your own HTML or „Custom Code“, the button runs – WordPress, Wix, Jimdo, Shopify, Webflow, Squarespace, Typo3 or plain HTML.
Can I add several agents / numbers?
One number per button. But with the HTML element version you can place
several <whatsapp-button> elements or switch the number dynamically.