Chatbase: Where the Embed Code Actually Goes on a Small-Business Site (Widget Script vs Iframe)

Disclosure: Chatbase is a third-party product. The Chatbase sign-up link below is my affiliate link. This is my own write-up, not an official Chatbase guide.

Most small businesses answer the same twenty questions by email every week: hours, prices, service area, how to book, the refund policy. Every answer is already in the FAQ, and someone still types it out. Anyone who writes after 5 PM waits until morning.

In my free lesson the example is Juniper Lane Bookkeeping, a made-up five-person firm. Say it's about 40 of those emails a week at 4 minutes each. That's about 2 hours 40 minutes a week, or about $520 a month at $45 an hour. Example numbers; use your own.

Building the Chatbase agent that answers from the FAQ is the fun part. The part that stalls is the last step: you click Copy, and now you're holding a snippet of code and you're not sure where it goes. This post is about that step.

First: don't paste anything until the answers hold up

The lesson stops at Copy on purpose. A wrong answer on your website costs more than the email it saved. Before the code goes anywhere, test in the Playground:

• Ask the questions customers really send, and check each answer against the FAQ. In our run, "Are you open on a Saturday in March?" got "Yes. In March, we're open Saturdays from 9:00 AM to 1:00 PM Eastern." That matches the FAQ.
• Ask something the FAQ doesn't cover. "Do you work with nonprofits?" got the fallback from our Guardrails: "I'm not sure about that one. Please email [e-mail] or call [phone] and a person will help." No guess.

The fallback comes from a Guardrails rule. These are the three the lesson adds under Build > Instructions:

3. Only answer from the training data. Never guess prices, dates or policies.
4. If the answer is not in the training data, say: "I'm not sure about that one.
   Please email [e-mail] or call [phone] and a person will help."
5. Never ask for bank statements, passwords or Social Security numbers in the chat.

Keep Temperature at Reserved for prices and policies.

Where the code comes from

In the Playground, click Deploy. The menu offers Website widget, Website iframe, Shopify and WordPress.

For the widget:

1. Click Website widget. The panel first says Channel disabled, so click Enable chat bubble.
2. Turn on Specific domains (Only allow embedding the agent on specific domains) and add your own site, one domain per line.
3. Under Widget setup is the script, with a Copy button. Send instructions via email sends it to your web person for you.

I always do step 2 before step 3. Without it, anyone can put your agent on their site and spend your message credits.

Widget script vs iframe: which one

They're two different shapes on the page.

	Website widget	Website iframe
What visitors see	A floating chat bubble in the corner, on every page it's loaded	A chat window drawn inside the page, where you put it
Code type	A <script> tag	An <iframe> tag
Where it goes	Once, site-wide, usually just before </body>	In the body of one specific page, where the chat should appear
Good for	"Ask us anything" help on the whole site	A dedicated Help or FAQ page

For most small-business sites I start with the widget. It's the same spot where a live chat box usually sits, and visitors already know what it is.

Pasting the widget script

The rule for any site-wide script: paste it once, in the shared part of the site, not on each page. The exact snippet comes from Chatbase's Copy button, so I'm not reproducing it here. Paste it as-is. Here's where it lands in a plain HTML page:

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Juniper Lane Bookkeeping</title>
</head>
<body>
  <!-- your page content -->

  <!-- Chatbase chat bubble: paste the Widget setup script here, unchanged -->
  <!-- PASTE_CHATBASE_WIDGET_SCRIPT_HERE -->
</body>
</html>

Why just before </body>? The page content loads first, and the bubble appears once the page is ready. If your site has a shared footer template, that's the one file to edit.

Where that shared spot lives depends on the platform:

• WordPress: Chatbase's Deploy menu has a WordPress option. Use it before you start editing theme files. If you go the manual route, use a header-and-footer code plugin or your theme's footer area, not a single page's content.
• Shopify: same idea, there's a Shopify option in the Deploy menu.
• Squarespace, Wix and similar builders: they have a site-wide "code injection" or "custom code" setting for the footer. Paste it there, not into a page block.
• A developer-built site: hand the snippet to whoever owns the layout template, with two lines: what it is ("a chat assistant that answers our FAQ") and where it should appear ("every page, bottom right").

Pasting the iframe

The iframe goes inside a page, where you want the chat to sit. Copy it from Website iframe and paste it into an HTML block on that page. If it looks squashed, wrap it in a container you control the size of:

<section class="help-chat">
  <h2>Ask us a question</h2>
  <div style="max-width: 720px; height: 640px; margin: 0 auto;">
    <!-- PASTE_CHATBASE_IFRAME_HERE -->
  </div>
</section>

Then set the iframe's own width and height to fill that box, if the copied code doesn't already. Most page builders strip <script> tags from ordinary text blocks but allow an "HTML" or "Embed" block. Use that.

Check it actually went live

Copying the code does nothing public. It's live only once it's in the published page. After your web person says it's done, load the page in a private window and look for the bubble. From a terminal, you can also confirm the code is in the page that visitors get:

curl -s https://www.yourfirm.example/ | grep -i -c "chatbase"

A 0 means the snippet isn't in the published HTML: it's on a draft, or a caching plugin is serving an old copy. Anything above 0 means it's there. If the bubble still doesn't show, check that the domain you're testing on is in the Specific domains list, including or excluding www. the way your site actually loads.

If you can, test on a staging copy or a hidden page first. A change to a live page affects everyone.

After it's live: read the logs weekly

Activity > Conversations holds the chat logs, Playground tests included. Each answer shows a confidence score. In our run, the Saturday answer scored 0.755 and the nonprofit fallback scored 0.369, shown in red. Low scores are the first place to look.

Under each answer is Revise answer, which creates a new Q&A entry in your data sources. I'd block 15 minutes a week to fix two or three answers and add anything missing to the FAQ. The agent is only as current as its sources.

What it costs

Chatbase's pricing page, read October 18, 2026, listed Hobby at $40 a month ($32 billed yearly) with 700 message credits, Standard at $150 a month with 4,000, and Pro at $500 a month with 15,000, with a 7-day trial and no free plan. Each answer uses 1 to 5 credits depending on the model. Check the page for current plans. You can try Chatbase here (affiliate link: I may earn a commission, at no cost to you).

Try it free

The lesson, Chatbase: Answer Customer FAQs with an AI Agent, builds this agent on real Chatbase screens, with a sample FAQ file you can download. For the general idea behind any snippet like this, my glossary page on embed code covers embed code vs a link.

Practice it step by step, free: https://learn.ynteractive.com/content/chatbase-ai-agent-answer-customer-faqs