A Shopify WhatsApp button opens WhatsApp on the shopper’s phone or desktop and starts a chat with the number you enter. Squadkin’s WhatsApp Chat Button does that with a theme app embed, a greeting you write, and a free plan that includes a round button, a pill with text, or a custom logo. The message arrives in WhatsApp. It does not appear as a shared inbox, an assignment, or a ticket inside the Shopify admin.

That is the right setup when your customers already ask sizing, shipping, and stock questions on WhatsApp and then wait on email. Install the embed, add the number, and send one test from the storefront. You do not need the WhatsApp Business API for this click-to-chat path. The catalog does not document that API.

Install the app embed and add your number

The button is injected through a Shopify theme app embed. A custom element draws it inside a shadow DOM, so the theme’s stylesheet does not restyle the widget, and the widget’s styles do not spill into the product page. Turn the embed on in the theme editor after you install the app. You do not paste a script into the theme for the basic button.

Enter the WhatsApp number your team actually answers. Write a short default message in the language your buyers use. The catalog supports one template variable in that message, {{ current_page_url }}, which inserts the page the shopper was on. It does not document a product-title variable. If you want a product name in the greeting, type that name into the default text yourself.

Two display modes are documented. Popup mode opens an in-page panel with a header, a canned greeting bubble, and a text area already filled with your default message. The Send control builds the WhatsApp link from the text left in that box. Direct-link mode skips the panel and makes the button itself the WhatsApp link. Pick popup when you want the shopper to see the greeting before they leave the site. Pick direct link when you want the fewest taps.

Choose one of the three button styles

The catalog’s free plan includes the full storefront widget: button design, the popup, business hours, the consent checkbox, page rules, and click analytics. Billing is through Shopify Managed Pricing. The catalog does not list a second paid tier for these controls.

  • Round logo: a circular button, useful when the corner should stay small.
  • Pill with text and image: a wider button that can say “Chat” or “WhatsApp” in your own words.
  • Custom logo: an uploaded image when the round mark is not the one you want.

Size is small, medium, or large. Background, icon, and text colors use HSB pickers. A pulse animation can use its own ring color. A custom CSS field can add rules inside the shadow DOM when the pickers are not enough. Keep that CSS short. A large override is harder to retest after a theme update.

A greeting bubble can wait before it appears, and a dismiss can persist so the same visitor is not nudged again in that session. A floating label has its own delay. The button itself can fade in after a number of seconds, which keeps it from covering the page at the first paint.

Place the button where shoppers already decide

Four positions are documented: bottom left, bottom right, middle left, and middle right, each with pixel offsets. Put the button where it does not sit on top of add to cart, a sticky cart bar, or a cookie banner. Check that on a phone, because a desktop preview hides most collisions.

Device settings can show or hide the button on mobile and on desktop separately. Page rules include or exclude by page type or by URL. A common pattern is to show the button on product pages and the contact page, and to leave it off a wholesale login or a checkout-adjacent page you would rather keep quiet. Extra rows under the popup can offer Telegram, Instagram, a phone call, or email. Those rows are still links. They are not a second inbox.

If sales and support use different numbers, the popup can list agents. Each agent has a phone number, a name, an avatar, and a greeting, and can be limited to page types. The shopper chooses. The app does not assign the chat to a queue. If your team needs one shared transcript and internal notes, this button is the wrong tool for that job.

Prove the first message on a real phone

Open the published theme on a phone that has WhatsApp, and again on a desktop browser. Tap the button. Confirm three things before you tell customers the chat is live.

  • WhatsApp opens on the number you entered, not on a personal number you used for testing and then forgot to replace.
  • The greeting is the sentence you wrote, including the page URL if you used the variable.
  • The message you send shows up in WhatsApp. It does not show up as an order, a draft order, or a support ticket in Shopify admin.

If you set business hours, repeat the test outside those hours. The catalog’s offline state changes the popup text and dims the button. The button stays on the page. Write the offline line so it names when you reply, instead of promising an instant answer.

Optional click analytics record button activations, popup opens, and send taps by day. Google Analytics and Meta Pixel passthrough can fire on trackable clicks if you turn that on in Tracking settings. Those counts are clicks. They are not revenue from the WhatsApp conversation.

Questions about adding the button

Do I need the WhatsApp Business API?

No. This widget is click-to-chat. The shopper’s WhatsApp app opens a chat with your number. The catalog does not document the WhatsApp Business API, a shared inbox, or message templates sent by an API.

Will the button work on a product page?

Yes, when your page rules include product pages. The shopper still leaves the product page and continues in WhatsApp. The product title is not inserted automatically. Type it into the greeting, or rely on the current page URL variable.

Does the free plan omit the popup or the hours?

The catalog’s free plan includes button design, the popup, business hours, the consent checkbox, page rules, and analytics. Confirm the price shown in the app before you install, and treat that screen as the live offer.

Read the controls on the WhatsApp Chat Button page, then install WhatsApp Chat Button when a click-to-chat link is the job you need. If you need agents assigned to one shared transcript, choose an inbox product instead of this button.

Work With Us

Have an Idea about project? Let's Connect!

Get In Touch
Let's Work Together