Add a WhatsApp chat button, and a call button, to your website
Let customers message you on WhatsApp, or call, from any page of your website. Free, with no sign-up.
Your WhatsApp number
The number your WhatsApp is on. Type it the way you’d dial it at home: we add the country code.
The number check didn’t load. Reload the page and try again.
Your link uses .
It’s typed into the chat for your customer, who can change it before sending.
Your button
The “Chat with us” label shows on computers. Phones get the round button alone.
Calls go to . On computers, it shows as text.
Plumbing and heating in Leeds
Boilers, leaks and bathrooms, with a fixed price before we start.
Get a quotePlumbing and heating in Leeds
Boilers, leaks and bathrooms, with a fixed price before we start.
Get a quoteAn example website. Your button sits in the same corner of every page.
Get your button
Type your number above, and these fill in.Opens a chat with you, with your message typed in. For your Instagram bio, emails and texts.
Too long for a QR code: shorten the message.
Paste it once, before </body> or in your builder’s footer code. It runs without any script of ours.
How to add itHow to add it
Paste it once, and it’s on every page
The code goes where your website builder adds code to every page, often called footer code or code injection. Choose your builder:
Add it to a WordPress website
About three minutesOn a block theme
- In WordPress, go to Appearance → Editor → Patterns → Template parts → Footer.
- Add a Custom HTML block, click Edit HTML, and paste your button code.
- Click Save. Then open your site on your phone and tap the button.
On a classic theme
- In WordPress, go to Appearance → Widgets.
- In a footer area, add a Custom HTML block, and paste your button code.
- Click Update at the top of the screen to save the footer.
Not sure which you have? Under Appearance, a block theme shows Editor, and a classic theme shows Widgets. Either way, the button then shows on every page.
Before you start: WordPress itself needs no paid plan. On WordPress.com, code needs a paid plan (Personal or higher) with hosting features switched on: on free sites it’s removed when you save. And only an Administrator can change the footer.
Got a Truewidgets account? Our free WordPress plugin can switch on the chat & call button for you, with no code to paste. The plugin on WordPress.org
Add it to a Wix website
About three minutes- In your site’s dashboard, go to Settings → Custom Code, and click + Add Custom Code.
- Paste your button code.
- Under Add Code to Pages, choose All pages (Load code on each new page).
- Under Place Code in, choose Body – end, and click Apply.
Before you start: Custom Code needs a published site with a connected domain, which needs a Wix Premium plan. On a free Wix site, add a Button instead: click its Link icon, choose Web Address, and paste your WhatsApp link.
Add it to a Squarespace website
About three minutes- In Squarespace, open the Pages panel, and go to Custom Code → Code Injection. (On Squarespace 7.0: Website Tools → Code Injection.)
- Paste your button code into the Footer box.
- Click Save, then open your live site in a private window: the button sits in its corner on every page.
Before you start: Code Injection needs Squarespace’s Core, Plus or Advanced plan (and some older plans): Basic and Personal don’t have it. On those, add a Button block instead, click Attach Link, and paste your WhatsApp link as its URL.
Add it to a Shopify store
About three minutes- In Shopify, go to Online Store, and click Edit theme (or Customize).
- In the Footer area, click Add section, and choose Custom Liquid.
- Paste your button code, and click Save. Every page shares the footer, so the button shows on all of them.
Before you start: you need a Shopify plan with the online store: Basic, Grow, Advanced or Plus, not Starter. Add the code in the footer like this, not in theme.liquid: theme updates can remove code edits.
Add it to a Webflow website
About three minutes- In Webflow, open Site settings, and go to Custom code.
- Paste your button code into Footer code, and click Save changes.
- Publish your site.
Before you start: Webflow runs this code on a paid Site plan, or with a Core, Growth, Agency or Freelancer Workspace.
Add it to a Framer website
About three minutes- In Framer, open Project Settings → Custom Code, and click Add Script.
- Paste your button code, choose End of <body> on all pages, and click Save.
- Publish your site.
Good to know: Framer doesn’t run custom code on the canvas: the button shows on your published site.
Add your link to a Google Sites website
About three minutesGoogle Sites has no place for code on every page, so the button code can’t go there. Your WhatsApp link can:
A button on a page
- In Google Sites, click Insert → Button.
- Type a name, like “Chat on WhatsApp”, paste your WhatsApp link, and click Insert.
- Click Publish.
A link on every page
- Scroll to the bottom of a page, and click Add footer. The same footer shows on every page.
- Type “Chat on WhatsApp”, select it, and add your WhatsApp link with the link button.
- Click Publish.
Good to know: Google Sites is free: there’s no plan to check.
Add it to any other website
About three minutes- Find where your website adds code to every page. It’s often called “footer code”, “body end” or “code injection”.
- Paste your button code there, then save and publish.
Where it is on other builders
- GhostSettings → Advanced → Code Injection → Site Footer
- WeeblySettings → SEO → Footer Code
- Square OnlineSettings → Tracking Tools → Add new code, then End of body, on every plan
- HubSpotSettings → Content → Pages → Site Footer HTML, on every plan
- DudaSettings → Header HTML → Body End HTML, on Team plans and higher
- Hostinger Website BuilderIntegrations → Custom code
Can’t add code? GoDaddy and Jimdo have no place for code on every page. Put your WhatsApp link on a button or in your footer instead.
Which one?
Link, button or chat panel?
All three start a WhatsApp chat with you. The first two are free here, with no sign-up. The third needs a free Truewidgets account.
A WhatsApp link
- For your Instagram bio, your emails and your texts
- With a QR code for flyers, the van and the shop window
- Nothing to install, and no website needed
- Not on your website by itself
The button code
- A button in the corner of every page of your website
- Paste it once into your builder’s footer code
- Runs on its own, with no script or account of ours
- Can’t tell when you’re open or closed
- No counts of chats and calls
The chat & call button
- A small panel with your name, logo and a greeting
- A call option that hides when you’re closed
- Change it any time, without pasting the code again
- Hours and number from your Google listing, holidays tooPro
- Counts of chats and callsPro
Calls
Add a call button too
Not everyone uses WhatsApp, and some jobs are quicker on the phone. Switch on “Add a call button” in the maker, and both buttons come in the same code.
On phones, a tap rings you
The call button is a phone link (tel:), which every phone understands. It sits just above the WhatsApp button.
On computers, your number as text
Computers can’t make calls, so your number shows beside the button, ready to dial from a phone.
Just want a link in your text?
Any phone number can be a link, like the one above. After tel:, write the full number with its country code and no spaces.
Good to know
Before you go live
Test it on your phone
Open your website on your phone and tap the button. WhatsApp should open a chat with your number, with your message typed in. If you added a call button, tap that too.
Use the international number
WhatsApp links need the country code and no 0 in front: 07700 900123 becomes 447700900123. The maker does this for you. If you ever write a link by hand, write it the same way.
On computers, WhatsApp Web or the app opens
A click opens WhatsApp’s page in a new tab. It offers the WhatsApp app if it’s installed, or WhatsApp Web in the browser. Your website stays open in the tab behind.
Keep it clear of your cookie banner
If a cookie banner or a shop’s “Add to cart” bar sits at the bottom of the screen, move the button up so it doesn’t cover it: in the code, change bottom:20px to bottom:96px. The button sets no cookies, so the banner needn’t mention it.
Questions
WhatsApp chat buttons, answered
Is it free?
Yes. The link, the QR code and the button code are free, with no sign-up and no email to give. Nothing on the button says Truewidgets: the code only carries a comment saying where it came from.
Do I need WhatsApp Business?
No. Any WhatsApp number works. WhatsApp Business is free too, and adds a business profile, quick replies and an away message for when you’re closed.
Does it work on computers?
Yes. A click opens WhatsApp’s page, which offers the WhatsApp app or WhatsApp Web in the browser. People who don’t use WhatsApp on their computer can scan your QR code with their phone.
Will it slow my site down?
No. It’s a few lines of HTML and CSS, with no script, font or picture to download. It draws along with your page.
How do I add a call button?
Switch on “Add a call button” in the maker and type the number to call. On phones, a tap rings you. Computers can’t make calls, so there your number shows as text beside the button.
Can I use my landline number?
For calls, yes. For WhatsApp, only if you’ve set up WhatsApp Business on that landline, which can check the number with a voice call. Otherwise, use your mobile.
Does it go through Truewidgets?
No. Your link and code go straight to WhatsApp and your phone, never through us, so they keep working even if you never use Truewidgets again.
Can I show it on some pages only?
Yes. Paste the code into those pages instead of your builder’s footer code. On WordPress, that’s a Custom HTML block on the page.
Can it show my opening hours?
Not the copied code: it can’t tell what time it is where you are. A free Truewidgets account adds a panel with your hours, and hides the call option when you’re closed. On Pro, the hours come from your Google listing.
What if a customer doesn’t use WhatsApp?
The link opens WhatsApp’s page, which asks them to get the app. That’s what the call button is for: switch it on, and they can ring you instead.
Want it to know when you’re open?
A free Truewidgets account turns your button into a small chat panel with your opening hours, and hides the call option when you’re closed. On Pro, the hours come from your Google listing.
Create free account → Go to your dashboard →WhatsApp is a trademark of Meta Platforms, Inc. Truewidgets isn’t part of WhatsApp or Meta.