WhatsApp Chat Button

The WhatsApp Chat Button is a floating button on your storefront. When a customer taps it, it opens a WhatsApp chat with your business number, optionally pre-filled with a message. It gives shoppers a one-tap way to ask a question before they buy.

Available on all plans (Starter, Basic, Growth, and Plus).

Turning it on

The chat button is delivered by a theme app embed, so there are two switches:

Enable the chat button on the WhatPro WhatsApp Chat Button page and Save.
Activate the app embed in your theme. When the embed isn’t on yet, the page shows a banner with a one-tap link to the theme editor — turn WhatsApp Chat Button on under App embeds and Save.

The page badge reads Active only when both the toggle is on and the embed is active. When both are on, the button appears on every storefront page.

WhatsApp number

Pick the country and enter the local digits of the number customers will chat with. WhatPro stores it in international (E.164) format. The country picker is searchable by name, ISO code, or dial code, and new stores default to your store’s billing country.

Pre-filled message

An optional message that pre-fills the customer’s chat input when they open the chat. They can edit it before sending. Use placeholders to inject details about the page or product the customer is on:

Placeholder	Inserts	Availability
`{{page_url}}`	Current page link	Any page
`{{page_title}}`	Current page title	Any page
`{{product_title}}`	Product title	Product pages only
`{{product_url}}`	Product link	Product pages only
`{{product_price}}`	Product price	Product pages only
`{{shop_name}}`	Your store’s name	Any page

The settings page provides clickable chips to insert each placeholder.

Design

Choose between two layouts:

Button With Icon — a circular WhatsApp icon only. Pick an icon style (App icon, Circle, or Solid); each style brings its own colors so the button looks polished out of the box.
Button With Text and Icon — a pill showing the icon plus your button text (for example, “Contact us”). For the pill you can set the corner radius, the pill background color, and the pill text color.

Additional design options:

RTL — when a customer browses in a right-to-left language (Arabic, Hebrew, Persian, Urdu) the pill flips so the icon sits on the right and the text on the left. On by default.
Avoid sticky add-to-cart bars — when your theme pins an add-to-cart or cart bar to the bottom of product pages, the chat button rises above it so they don’t overlap. You can set the gap (in pixels) left between the bar and the button. Works on any theme automatically.
Hide when a drawer or modal opens — fades the button out while a cart drawer, menu drawer, or modal is open so it doesn’t sit on top of those CTAs.

Position

Place the button on the Left or Right of the screen.

Desktop and mobile sizing

You control desktop and mobile independently. Each can be enabled or disabled on its own, and each has its own dimensions:

Right / Left / Bottom position — offset from the screen edges (in pixels).
WhatsApp icon size.
Button height and button text font size — for the pill (Text and Icon) layout.

The settings page includes a live preview with a Desktop/Mobile toggle so you can see exactly how the button will look on each device.

Greeting bubble

Optionally show a small greeting bubble next to the button after a delay. Set the greeting text and the delay (in seconds) before it appears. This nudges shoppers to start a conversation.

Schedule and business hours

Choose when the button shows:

Always (24/7) — the button is always visible.
Business hours only — pick a timezone and set weekly hours per day (open/close times, or mark a day closed).

When set to business hours, choose what happens outside hours:

Hide the button, or
Show an offline message — a bubble with text you write, letting customers know you’ll reply when you’re back.

Hide on specific URLs

Hide the button on storefront pages whose URL path contains any value you list. For example, enter /checkout to hide it on all checkout pages, or /cart for the cart page. Turn URL hiding on, then add one or more path fragments.

Translations

Translatable strings (button text, pre-filled message, greeting text) are mirrored to your Shop metafields, so Shopify’s Translate & Adapt app can manage their translations alongside the rest of your storefront content.