Add the chat to a Blogger blog

What it is

Blogger gives you two ways to add your own HTML, and the Agentency snippet works with either. The no-code way is a Layout → Add a Gadget → HTML/JavaScript gadget. The precise way is Theme → Edit HTML, pasting the tag just before the closing </head> tag. Both end up loading the same chat bubble across your blog.

Start with the gadget. It is reversible in one click and cannot break your theme.

When you would use it

Use this on a Blogger blog where readers ask questions in comments that you would rather answer instantly — a recipe blog, a local business blog, a school or club site. Blogger has no plugin ecosystem, so pasting the snippet is the only route, and it is a short one.

Where to find it

Open Dashboard → Chatbots → your chatbot → Integrations → Plugins → Blogger.

Before you start

• You need to be an Admin on the blog. Authors cannot change Layout or Theme.
• Add your blog's address to the widget allowlist in Agentency. If you use the free address it is yourblog.blogspot.com; if you connected a custom domain, add that host as well. See Allow the widget on your domains.
• Confirm the chatbot is Active on its Playground tab.

Steps

The no-code route:

1. Open Dashboard → Chatbots → your chatbot → Integrations → Plugins and click the Blogger card.
2. Click Copy embed code.
3. Sign in to Blogger and choose the blog you want to change.
4. In the left menu, click Layout.
5. In any area of the layout, click Add a Gadget.
6. Choose HTML/JavaScript from the list and click it.
7. Leave the title empty — a title would print a visible heading on your blog — and paste the snippet into the content box.
8. Click Save, then click Save (in older Blogger this button is labelled Save arrangement) at the bottom of the Layout screen so the arrangement itself is stored.
9. Open your blog in a normal tab and send a test message. Check it under Conversations.

The theme route, if you want the tag in the head instead:

1. In the left menu, click Theme.
2. Under My theme, open the ⋮ menu and choose Edit HTML.
3. Find the closing </head> tag and paste the snippet on the line just above it.
4. Click Save.

What the snippet looks like

The same tag works in both places. Copy yours from the Plugins drawer — the token below is a placeholder:

<!-- Blogger: Layout -> Add a Gadget -> HTML/JavaScript (or Theme -> Edit HTML, before </head>) -->
<script src="https://agentency.com/js/chatbot-widget.js" defer data-widget-token="wt_YOUR_WIDGET_TOKEN" data-api-base-url="https://api.agentency.com" referrerpolicy="strict-origin-when-cross-origin" crossorigin="anonymous"></script>

The widget floats above your layout regardless of which layout area the gadget sits in, so it does not matter whether you added the gadget to the sidebar or the footer.

What you will see

In Layout, a new HTML/JavaScript block appears wherever you placed it, with no visible content on the blog itself. On the live blog, a chat bubble appears in the corner set by your chatbot's appearance settings, on the home page, on individual posts, and on static pages.

Limits and plan notes

Embedding on your own site is a paid Agentency feature — the Free plan shows the Plugins catalogue locked and gives you a hosted chatbot link instead. See Which plans include integrations and the pricing page.

Blogger itself places no limit on HTML gadgets, and Google notes that anything you add through them is added at your own risk — normal for any third-party script.

One Blogger quirk to plan around: if you switch themes later, an Edit HTML change is lost, because you replaced the theme file that contained it. A Layout gadget survives a theme switch. That is the strongest reason to prefer the gadget route.

Common problems

I clicked Save on the gadget but the bubble is gone after a refresh.

The gadget was saved but the layout arrangement was not. Go back to Layout and click the Save button at the bottom of that screen.

Blogger stripped my code.

The old Blogger post editor sanitises script tags, but the HTML/JavaScript gadget and Edit HTML do not. If the code vanished, you pasted it into a post, not a gadget.

The bubble is blocked on my blogspot address.

yourblog.blogspot.com and your custom domain are different hosts. Add both to the allowlist. Country-specific redirects such as blogspot.co.uk are separate hosts too.

Edit HTML shows an error when I save.

Blogger validates the theme as XML, so an unclosed tag anywhere in the file blocks the save. Undo your paste, save to confirm the theme was already valid, and use the gadget route instead.