Back to Blog
Guide

AI Chatbot for Bubble: Install the Plugin in 5 Minutes

Add an AI chatbot to your Bubble app with the official AssistLoop plugin. Train it on your content, paste your Agent ID, and go live in about five minutes.

7 min read
AI Chatbot for Bubble: Install the Plugin in 5 Minutes

Your Bubble app works. Someone signs up at 11pm, can't find where to change their plan, and emails you instead. You answer it the next morning, for the fourth time that week.

An AI chatbot for Bubble closes that gap, and you don't have to fake one with an API connector or a stray HTML element. AssistLoop ships an official Bubble plugin, so the widget drops onto your canvas like any other element. Here's the whole install, and the things that actually go wrong afterward.

What you'll need

An AssistLoop account, edit access to your Bubble app, and about five minutes. The AssistLoop free tier is enough to get a trained agent answering, with no credit card. It caps at 150 message credits per month and doesn't include widget styling or human handoff, so treat it as a trial rather than a plan.

Sort out one thing first, because it catches people at the last step. Bubble allows add-ons regardless of your plan, so you can install this plugin and watch it work in Preview on a free Bubble app. Deploying that app to live is a different question, and Bubble's Free plan can't do it. Going live starts at their Starter plan. If your app isn't live yet, the chat widget was never the thing standing in your way.

Step 1. Create and train your agent

Sign up at assistloop.ai, name your agent, then give it something to know. There are four training sources, and you can mix them freely:

  • Crawl your website. Point it at your URL and it reads your public pages. Free plans cap at 10 links per agent.
  • Upload files. PDF, DOCX or TXT, up to 42MB each on paid plans. Free allows 1MB total, which is roughly one decent help doc.
  • Paste raw text. Useful for the policies that live in someone's head and were never written down.
  • Write Q&A pairs. An exact question mapped to an exact answer, returned the way you wrote it.

Here's the part specific to Bubble, and it's the one people get wrong. A crawler can only read what's publicly reachable. Your app's actual interface sits behind a login, so the crawl never sees it. Everything a visitor wants to know once they're inside your product (where the plan switcher lives, why an upload failed) is invisible to the crawler. That knowledge has to arrive as Q&A pairs or pasted text, typed by you.

Budget an hour writing out your ten most-asked support questions. Nothing else here pays off as well.

The agent retrains automatically when you add a source, so staying current isn't a rebuild.

Step 2. Install the plugin in Bubble

In your Bubble editor, open the Plugins tab and click Add plugins. Search for AssistLoop - AI Chatbot and install it. You can also look at the listing on Bubble's marketplace first if you want to see it before it lands in your editor.

Step 3. Connect your Agent ID

Back in AssistLoop, open the widget installation screen in your dashboard. Your Agent ID sits next to the embed snippet. Copy it. That string is the only thing Bubble needs from AssistLoop.

In the editor, drag the AssistLoop element onto a page and paste the Agent ID into its property panel.

Put it on a single page and the chat lives on that page only. If you want it everywhere, add it to a reusable element that already appears across your app. Your header or nav bar is the usual home. Add it once there and it rides along on every page that uses that reusable, including pages you haven't built yet.

Step 4. Customize the widget

Widget styling is a dashboard setting, not a Bubble setting. You change it in AssistLoop and your app picks it up with no redeploy and no republish.

Worth setting before you show anyone:

  • Brand color and logo. A default-blue widget on a custom-designed app reads as a third-party bolt-on, and visitors trust it less.
  • Greeting. "Need a hand getting set up?" gets more replies than "How may I assist you today."
  • Avatar and agent name. Your logo or a real face.
  • Light or dark mode. Match your app, or it fights your theme.
  • Suggested replies. Pre-fill the questions you want asked. These double as a steering mechanism: put your best-answered questions here and the agent looks sharper than it is.

The honest caveat: none of this is available on Free. Widget customization starts at Basic, which is $25/mo on annual billing. On Free you get the default widget with "Powered by AssistLoop" on it. Check current pricing before you plan around that. Plan details last verified July 2026.

Step 5. Publish and test

Hit Preview. A working install puts the chat bubble in the corner on every page carrying the element, and asking it something from your training sources gets a specific answer back, not a generic one.

Test it with a question you know is in your Q&A pairs, then one you know isn't. The second answer matters more. An agent that confidently invents something for an untrained question will do the same to a customer. If that happens, you're short on training data, not stuck with a broken agent.

Then deploy to live and check it there too. If Bubble tells you your plan doesn't allow live deployment, that's Bubble talking, not AssistLoop. Preview is as far as a free Bubble app goes, and your widget is fine.

Troubleshooting

The agent answers marketing questions but fumbles product questions. Your crawl only reached your public pages. Nothing behind your login was ever indexed. Fix it with Q&A pairs covering in-app tasks, as in Step 1.

Your styling changes don't show up. Check your plan first. Widget customization is a paid feature, and on Free the settings won't take effect even though the widget itself works.

The agent stops responding partway through the month. You're out of message credits. Each visitor message and each AI response counts as one, so 150 credits on Free is around 75 back-and-forth exchanges total, which a real app burns through in days. A 1,500-credit top-up is $10 one-time, or Basic includes 3,000/mo.

What to do next

Two things turn this from a widget into something that carries weight.

Turn on human handoff. A visitor escalates mid-conversation and your team picks up the whole thread in a shared inbox, with history, country, browser and device already attached. You reply from the dashboard or the mobile apps. Nobody has to ask the customer to explain their problem twice. It's on every paid plan.

Then wire up an Agent Action. Connect Calendly and the agent books the meeting inside the chat. Connect HubSpot and it files a real ticket into your actual pipeline at the right priority. The agent finishes the job in the conversation instead of handing over a link for the visitor to deal with later. For a Bubble app selling something, that's the difference between deflecting support and moving a deal.

FAQ

Can the agent answer account-specific questions for logged-in users?
Yes, with verified user identity. Your app signs a token with a shared secret so the agent knows who it's talking to. Without it, the agent has no idea who the visitor is and shouldn't be answering anything account-specific.

Can I turn the AI off and use it as plain live chat?
Yes. Switch the AI off and the widget becomes a straight live-chat inbox for your team. Some teams start there while they build up training data, then turn the agent on.

What happens when I run out of message credits?
The agent stops answering until the next cycle. Credits don't roll over. You can add 1,500 credits for $10 as a one-time purchase without upgrading your plan.

Does this work on a free Bubble plan?
You can install the plugin and test it in Preview, because Bubble allows add-ons on any plan. You can't deploy that app to live, which is Bubble's restriction rather than AssistLoop's, and it applies to your whole app rather than the widget. Live deployment starts at Bubble's Starter plan. Bubble plan details verified July 2026.

Bubble got you a working app without writing code. The chatbot part shouldn't be where that ends. Install the plugin, paste your Agent ID, and your app answers at 11pm without you.

Create your AI agent, free, no card required.

Hasen

Written by

Hasen