How to add chat support to a Bubble app

You can add chat support to a Bubble app by creating a simple chat data structure (Chat + Message), displaying messages in a repeating group, and using auto‑refreshing (Do every 5 seconds) to simulate real‑time updates. For external customer‑support tools like Intercom or Crisp, you can paste their widget script into Bubble’s Settings → SEO / metatags → Script in header, and it will load instantly on every page.

Two Ways to Add Chat

You can add chat support either by building your own chat inside Bubble or embedding a third‑party chat widget. Building it gives you full control. External widgets are faster to set up.

• Data type: Chat (fields: Users [list of Users])
• Data type: Message (fields: Chat, Text, Sender, Created Date)

Create a page with a Repeating Group of Messages filtered by the current Chat. Below it, add an Input and a Send button. The Send workflow creates a new Message linked to the Chat. To make it feel live, add a Do every 5 seconds workflow → Display list in Repeating Group.

// Example Bubble HTML header script for Crisp widget
<script type="text/javascript">
window.$crisp=[];
window.CRISP_WEBSITE_ID="YOUR_CRISP_ID";
(function(){
 d=document; s=d.createElement("script");
 s.src="https://client.crisp.chat/l.js"; s.async=1;
 d.getElementsByTagName("head")[0].appendChild(s);
})();
</script>

When to Use Built‑In vs Widget

Use Bubble‑built chat when you need features like roles, attachments, or storing transcripts. Use Crisp/Intercom/Tawk when you just need “support chat” fast — no workflows required, only pasting the script.