Free tool· Generators & builders
Add a WhatsApp chat button to your Blogger blog
No theme HTML to edit: one gadget puts a floating WhatsApp button on every post and page of your blog.
- Runs in your browser
- Free, no signup
- Updated
Configure WhatsApp chat button
The floating button every visitor sees.
😊 Emoji welcome. You can use {{page_url}} & {{page_title}} — filled with the page the visitor is on.
Chat widget
The card that opens above the button — brand it like your own.
😊 Emoji welcome — {{page_url}} & {{page_title}} work here too.
After a visitor closes it, when may it auto-open again?
URL personalization
Personalize the messages based on your website's URL — a rule matches when its source URL appears in the visitor's address. Parameters: {{page_url}}, {{page_title}}.
Applies to the substituted {{page_title}} value — "red-shoes – your store" becomes "Red shoes – your store". URLs stay untouched.
Live preview
Gradient header with the greeting on a floating card. Click the button in the preview to close and reopen it.
{{page_title}} previews as "Red shoes – Your Store". On your site the real page title and URL are used — pick a rule above to preview its personalization.
Your embed script
<!-- Enter your WhatsApp number to generate the script -->
Paste it just before </body>. The widget loads async from infiq.in, runs no inline code and draws itself in its own sealed layer, so your theme's CSS can't break it. Works on any site: Shopify, WordPress, Wix, custom. Keep the "Powered by InfiQ" link inside — it's the small credit in the chat card's footer.
Quick answer
How do I add a WhatsApp widget to Blogger?
To add a WhatsApp widget to Blogger, build it above and copy the embed code. In Blogger, open Layout, click Add a Gadget, choose HTML/JavaScript, paste the code and save. The widget floats over every page wherever the gadget sits, and you never touch your theme's HTML.
- Price
- Free
- Plugin or app
- None
- Setup time
- About 5 minutes
- You need
- Any Blogger blog
Step by step · 4 steps
Step by step: the WhatsApp widget on Blogger
Step 1: Build and copy your widget
In the generator on this page, enter your WhatsApp number with the country code, pick one of the five designs, set your colours and greeting, then click Copy script.
Step 2: Add a gadget
In Blogger, open Layout and click Add a Gadget in a sidebar or footer section that shows on every page.
Step 3: Paste into HTML/JavaScript
Choose HTML/JavaScript, paste the embed code into the content box, leave the title empty and click Save.
Step 4: Save the layout
Click Save (Save arrangement on older layouts), then view your blog.
Blogger tips
Get more from the WhatsApp widget on Blogger
Post-aware messages
Put {{page_title}} in the message so readers' questions arrive with the post's title attached.
Not showing on phones?
Some themes hide sidebar sections on mobile. Move the gadget to a section that shows on both, such as the footer.
Or edit the theme
You can also paste the code just above </body> in Theme → Edit HTML, but the gadget is easier to find and change later.
Not sure which look to pick? Compare the five widget designs.
FAQ
WhatsApp widget for Blogger: questions and answers
Will the gadget leave an empty box in my sidebar?
No visible box: the widget floats over the page, so the gadget itself takes no space beyond any padding your theme adds.
Does it work on a custom domain?
Yes. The gadget works the same on blogspot.com addresses and custom domains.
Is it free?
Yes. The widget and its hosting are free, with no signup and no message limits.
Still have questions?
Book a demoOther platforms
Add the WhatsApp widget to another site
Put a team behind the widget.
InfiQ turns every widget conversation into a managed lead — shared team inbox, chatbots, broadcasts and analytics on the official WhatsApp Business API. 7-day free trial, no card required.