How to add a WhatsApp button to your Shopify store
You can add a WhatsApp button to Shopify in two ways: paste a wa.me link into your theme, or install an app that adds a floating button as a Theme App Extension. The link method takes five minutes and costs nothing; the app method adds styling, page targeting, a pre-filled message and click analytics without editing theme code.
By Mousa Alhelo, founder, E-SAFQA · Updated · 6 min read · How we write and test these guides
Method 1: a wa.me link in your theme
- Build the link: https://wa.me/<number in international format without + or spaces>?text=<URL-encoded message>. Example: https://wa.me/962790000000?text=Hi%2C%20I%20have%20a%20question%20about%20your%20products
- In Shopify Admin open Online Store → Themes → Customize, pick a section such as the footer or an announcement bar, and add a button or link block pointing to that URL.
- If your theme has no suitable block, add a link in the theme code (Edit code → layout/theme.liquid) just before </body>, styled as a fixed-position element.
- Test on a phone: the link must open WhatsApp with your number and the message prefilled.
Method 2: a Theme App Extension (app embed)
- Install a WhatsApp widget app. With WhatsApp Pilot, open Settings and save your country code, number and default message.
- Open the Floating Widget page: choose position, size, colors, border radius, greeting and the pages the button should appear on, with a live preview.
- In Theme Editor → App embeds, switch the app on and save. No theme code is touched, and uninstalling removes the button cleanly.
- Open your storefront, tap the button, and send the test message to yourself.
Which one should you use?
| wa.me link | Theme App Extension | |
|---|---|---|
| Cost | Free | Free plan in WhatsApp Pilot; Pro for all page types |
| Theme code | You edit it | Untouched |
| Appearance | Whatever your theme offers | Position, size, colors, greeting, label |
| Page targeting | Manual per section | Homepage, product, collection, cart, other pages |
| Prefilled message with page URL | Static text only | Dynamic, includes the page the shopper is on |
| Click analytics | None | Clicks by day and by page |
| Theme updates | May break custom code | Survives theme updates |
Common mistakes
- Using a local number format in wa.me (leading zeros or a plus sign break the link).
- Showing the button on the checkout page, where Shopify does not allow theme code or app embeds.
- Forgetting to enable the app embed in Theme Editor, the most common reason an installed widget does not show.
Frequently asked questions
Does a WhatsApp button need the Business API?
No. Both methods open a normal WhatsApp chat on the shopper's device. Nothing is sent automatically.
Can the button show only on product pages?
With the app method, yes: WhatsApp Pilot Pro lets you choose page types and devices.
Ready to put WhatsApp to work on your store?
Start with the free widget. Upgrade to Pro for order messages, cart recovery, the smart product button, back-in-stock alerts and Product Demand.