How to Integrate Intercom with Bubble

What Intercom Does for Your Bubble App

Intercom is a customer communication platform that bundles live chat, automated messaging, product tours, help center articles, and user analytics into one tool. For Bubble builders, the core value is the Messenger widget — that chat bubble in the bottom corner of your app where users can ask questions, report bugs, or get onboarded through automated messages.

But Intercom is more than just chat. When properly integrated with Bubble, it becomes a user intelligence layer. You can track user behavior, segment users based on their in-app actions, trigger automated messages when users hit specific milestones, and maintain a complete conversation history tied to each user's profile. For SaaS products built in Bubble, Intercom often becomes the primary tool for support, onboarding, and retention.

Use Cases That Make Intercom Worth Adding

The first use case is live customer support. Your users click the chat widget, type a question, and your support team (or an AI bot) responds in real time. Every conversation is tied to the user's Intercom profile, which shows their name, email, plan type, and any custom attributes you've synced from Bubble. Your support team gets context before they even respond.

The second use case is automated onboarding. You can configure Intercom to send a welcome message when a user signs up, a follow-up if they haven't completed a key action within 48 hours, and a product tour that walks them through your app's core features. All of this runs automatically based on user attributes and events you send from Bubble.

The third use case is churn prevention. Intercom can identify users who were previously active but haven't logged in for a set period, then automatically send them a re-engagement email or in-app message. You define the criteria using custom events and attributes synced from your Bubble database, and Intercom handles the messaging logic and delivery.

Setting Up the Intercom Messenger in Bubble

The fastest way to add Intercom to your Bubble app is embedding the Messenger widget. Sign up for Intercom and grab your workspace's app_id from Settings, then Installation. Intercom gives you a JavaScript snippet that loads the Messenger on any page.

In Bubble, add this snippet to your app's SEO/Meta Tags section (Settings, then SEO/metatags, then Script/meta tags in the header) to load it on every page. Alternatively, add it to specific pages using an HTML element if you only want Intercom on certain pages.

The basic snippet shows the Messenger to all visitors as anonymous users. To identify logged-in users, you need to pass user data to Intercom. Add a JavaScript snippet that runs after login, using Bubble's dynamic data to inject the current user's email, name, and unique ID into Intercom's boot command. This looks like a script that calls window.Intercom with the 'update' command and includes name, email, and user_id fields populated by Bubble's current user data.

For security, enable Intercom's Identity Verification. This requires generating an HMAC hash of the user's email or ID using your Intercom secret key. Since Bubble can't natively compute HMAC hashes, you'll need either a backend plugin that supports HMAC (like the Server Script plugin or Toolbox's server-side action) or a small server-side function that generates the hash and returns it to your Bubble app.

Syncing User Data from Bubble to Intercom

The Messenger identifies users, but Intercom's real power comes from rich user profiles. You want Intercom to know each user's plan type, sign-up date, number of projects created, last active date, and any other attributes that help your team provide context-aware support and trigger smart automations.

There are two ways to sync this data. First, pass custom attributes in the Intercom JavaScript snippet when the page loads or when key events occur. You can include any Bubble data as custom attributes in the Intercom update call. This is simple but only syncs when the user is actively browsing.

Second, use Intercom's REST API via Bubble's API Connector to update user profiles from backend workflows. This approach works for data that changes without user interaction — like when a payment processes, a teammate invites them, or their trial expires. Set up API calls to Intercom's /contacts endpoint with your Intercom API token as a Bearer token in the Authorization header.

The API Connector setup is straightforward. Create an API called "Intercom" with base URL https://api.intercom.io. Add an Authorization header with value "Bearer YOUR_ACCESS_TOKEN". Create a POST call to /contacts with a JSON body containing the user's external_id (their Bubble unique ID), email, and any custom_attributes you want to sync.

Tracking Events from Bubble to Intercom

Custom events are how you tell Intercom what users are doing in your app. Events like "created-project," "invited-teammate," "upgraded-plan," or "exported-report" let you build segments and trigger automations based on actual behavior, not just profile attributes.

Send events to Intercom via their Events API. Create an API Connector call that POSTs to /events with a JSON body containing the event_name, created_at timestamp, and user_id. Add this API call to your Bubble workflows wherever the relevant action occurs. For example, when a user creates a new project, your workflow saves the project to Bubble's database and also fires an Intercom event call.

Keep your event names consistent and well-documented. Intercom limits you to 120 unique event names per workspace. Plan your event taxonomy before you start sending data — changing event names later means losing historical data for the old names.

Common Pitfalls

The most frequent issue is the Messenger appearing before user data loads. If the Intercom JavaScript snippet fires before Bubble has loaded the current user's data, the Messenger boots in anonymous mode. Then when user data loads and you call Intercom('update'), you end up with duplicate contacts — one anonymous and one identified. Fix this by delaying the Intercom boot call until the current user's data is available, using Bubble's "Current User is logged in" condition.

Performance impact is another concern. Intercom's JavaScript bundle is substantial — around 200-300KB. It can slow down your initial page load, especially on mobile. Load Intercom asynchronously and consider lazy-loading it after the page's critical content has rendered. Some builders only load Intercom after the user has been on the page for a few seconds or after they click a "Chat with us" button.

Rate limits on Intercom's API also catch people off guard. The API allows a limited number of requests per minute per workspace. If you're syncing user data for hundreds of users simultaneously (like during a bulk import or migration), you'll hit the limit. Use Bubble's "Schedule API Workflow on a List" with delays between items to stay within Intercom's rate limits.

Data privacy is a consideration too. Intercom stores user data on its servers, which means you're sharing user information with a third party. If your Bubble app handles sensitive data (healthcare, financial), review Intercom's data processing agreements and ensure compliance with GDPR, CCPA, or whatever regulations apply to your users.

DIY vs Hiring a Bubble Developer

Basic Intercom installation — the Messenger widget with identified users — takes about a day for any Bubble builder. You paste a JavaScript snippet, add user data, and it works. Where complexity increases is identity verification (HMAC hashing), custom event tracking across dozens of workflows, and bidirectional data sync between Intercom and Bubble.

If you're building a SaaS product where Intercom drives your onboarding and support workflows, invest the time to set it up properly from the start. Migrating from a messy Intercom integration later means cleaning up duplicate contacts, lost conversation history, and broken automations. A developer experienced with Intercom and Bubble can typically ship a full integration in three to five days.

Ready to Add Intercom to Your Bubble App?

Related guides:

• how to build a helpdesk with Bubble

• Bubble slack integration guide

Intercom transforms your Bubble app from a tool into a product that communicates with its users. Live chat, automated onboarding, and behavior-based messaging are the features that separate apps people try from apps people stick with. Talk to our team at Goodspeed Studio about integrating Intercom into your Bubble product.