How to Integrate WhatsApp with Bubble

What WhatsApp Integration Means for Your Bubble App

WhatsApp has over two billion users globally. In many markets — Latin America, Southeast Asia, Europe, Africa — it's the primary communication channel, ahead of email and SMS. Integrating WhatsApp with your Bubble app means meeting users where they already are, using a channel they check dozens of times daily.

The integration uses the WhatsApp Business API (now part of Meta's Cloud API), not the consumer WhatsApp app. This API lets your Bubble app send template messages (pre-approved by Meta), receive and respond to user messages, send notifications and alerts, and handle customer support conversations programmatically. You're not building a chat clone — you're adding a messaging channel that connects your Bubble product to the WhatsApp app your users already have installed.

Use Cases That Drive Adoption

The first use case is transactional notifications. Order confirmations, shipping updates, appointment reminders, payment receipts, and two-factor authentication codes. These are messages triggered by events in your Bubble app that your users need to see immediately. WhatsApp's 98% open rate (compared to roughly 20% for email) makes it the highest-impact delivery channel for time-sensitive messages.

The second use case is customer support. Users message your WhatsApp number with questions, complaints, or requests. Your Bubble app receives these messages via webhook, displays them in an admin dashboard, and lets your support team respond — all within Bubble. You can build automated responses for common questions, route conversations to the right team member, and track resolution times.

The third use case is conversational commerce. In markets where WhatsApp dominates, entire purchase flows happen in chat. A user asks about a product, your app sends a catalog (using WhatsApp's interactive message types), the user selects an item, your app generates an order in Bubble, sends a payment link, and confirms the purchase — all within the WhatsApp conversation thread.

Setting Up the WhatsApp Business API

Meta provides the WhatsApp Business API through the Meta Cloud API. Start by creating a Meta Business account at business.facebook.com. Then set up a WhatsApp Business Account and register a phone number. Meta walks you through verification. You can use a new number or port an existing one, but the number can't be currently registered with the consumer WhatsApp app.

In the Meta Developer portal, create an App and add WhatsApp as a product. Meta provides a temporary access token for testing and a permanent System User token for production. You'll also get a Phone Number ID and WhatsApp Business Account ID, which you need for API calls.

Before you can send messages to users, two conditions must be met. Either the user has messaged your WhatsApp number first within the last 24 hours (opening a "conversation window"), or you use a pre-approved message template. Templates are messages with a predefined structure that you submit to Meta for review. Meta approves them (usually within minutes to hours) and then you can send them to any user who has opted in to receive messages from your number.

Connecting WhatsApp to Bubble via API Connector

In Bubble's API Connector, create an API called "WhatsApp" with base URL https://graph.facebook.com/v18.0. Add your permanent access token as a Bearer token in the Authorization header.

To send a template message, create a POST call to /{phone_number_id}/messages with a JSON body containing the messaging_product ("whatsapp"), the recipient's phone number (in international format with country code), the message type ("template"), and the template object with the template name, language code, and any variable components.

For example, an order confirmation template might have placeholders for the customer's name, order number, and delivery date. Your Bubble workflow populates these variables from the database and fires the API call. The user receives a formatted WhatsApp message on their phone within seconds.

To send free-form messages during a conversation window (when the user has messaged you within the last 24 hours), use the same endpoint but with type "text" and a body containing your message text. You can also send images, documents, audio, video, locations, and interactive messages (buttons, lists) using the appropriate message type.

Receiving Messages via Webhooks

When a user sends a message to your WhatsApp number, Meta's Cloud API sends a webhook to your Bubble app. Set up a Backend Workflow API endpoint in Bubble to receive these webhooks. In the Meta Developer portal, configure the webhook URL and subscribe to the "messages" webhook field.

Meta requires a webhook verification step before activating the subscription. Your Bubble endpoint needs to handle a GET request with a hub.verify_token parameter and return the hub.challenge value. Create a Backend Workflow that checks the verify token matches your expected value and returns the challenge. Once verified, Meta starts sending message webhooks as POST requests.

The webhook payload contains the sender's phone number, the message content (text, media URL, or interactive response), a timestamp, and a message ID. Parse this in your Bubble workflow, create a message record in your database, and trigger any automated response logic. For media messages, download the media from Meta's API (the webhook provides a media ID, not the file directly) and store it in your Bubble database.

A complete messaging workflow in Bubble looks like this: receive the webhook, save the incoming message to a "Messages" data type linked to a "Conversation" record, check if an automated response should be triggered (keyword matching, business hours check, FAQ lookup), and either send an automatic response or notify a human agent through your Bubble admin dashboard.

Common Pitfalls

The 24-hour conversation window is the most misunderstood constraint. You cannot send free-form messages to users who haven't messaged you within the last 24 hours. Outside that window, you can only send pre-approved templates. If your app needs to send proactive notifications (appointment reminders, shipping updates), you must use templates. Plan your template library before building the integration.

Phone number formatting causes many failed deliveries. WhatsApp requires numbers in international format with country code and no leading zeros, dashes, or spaces. For example, a UK number must be 447XXXXXXXXX, not +44 07XXX XXXXXX. Validate and format phone numbers in your Bubble workflow before passing them to the API.

Meta's webhook delivery can be delayed during high-traffic periods. Don't build workflows that depend on instant webhook delivery. Build retry logic and handle duplicate webhooks gracefully — Meta may send the same webhook multiple times if your Bubble app doesn't return a 200 response fast enough.

Rate limits and messaging costs also need attention. WhatsApp Business API isn't free for business-initiated conversations. Meta charges per conversation (a 24-hour window), with pricing varying by country and conversation category (utility, marketing, authentication, service). Factor these costs into your product pricing, especially if you're sending high volumes of notifications.

DIY vs Hiring a Bubble Developer

Sending template messages from Bubble is a straightforward API Connector setup — expect a day or two. Receiving and processing incoming messages via webhooks adds two to three days. Building a full customer support interface in Bubble (conversation threads, agent assignment, automated responses, media handling) takes one to two weeks.

The Meta Business verification process and template approval workflow are administrative steps that take time regardless of technical skill. Budget a few days just for account setup, number registration, and getting your first templates approved. If WhatsApp messaging is central to your product, an experienced developer who's navigated Meta's approval process before can save you significant time on the non-technical hurdles.

Reach Users Where They Are

Related guides:

• Bubble twilio integration guide

• Bubble telegram integration guide

WhatsApp integration gives your Bubble app access to the world's most widely used messaging platform. For notifications, support, and conversational commerce, it's the highest-engagement channel available. Talk to our team at Goodspeed Studio about building WhatsApp into your Bubble product.