You published your site on Notion because it took an afternoon instead of a sprint. Landing page, docs, changelog, all in one workspace. Then a visitor has a question, finds no way to ask it, and leaves. So you search for notion website live chat and find a pile of tutorials that pretend a script tag works on a plain notion.site page. It does not, and any guide that skips that fact is wasting your time.
Here is the truth up front: a page published straight to notion.site cannot run custom JavaScript, so no chat widget (ours included) can load there directly. But there are two clean workarounds, and both take under an hour. This guide covers the limitation, the builder route, the self-hosted wrapper route, and how to train an AI agent on the Notion content you already wrote.
Why a plain notion.site page cannot run a chat widget
Every live chat product installs the same way: you paste a small script tag into your site's HTML, the script loads asynchronously, and it draws a floating chat bubble on top of your content. That requires the platform to let you inject code into the page. Notion does not offer that. There is no custom code field, no head injection setting, nothing in the publish options that executes arbitrary scripts.
People try to work around it in three ways, and none of them hold up:
- →A code block with the script inside. Notion renders it as highlighted text. It displays your code beautifully and never executes a line of it.
- →An embed block. This loads an external URL inside an iframe that sits in your content flow. You could embed a chat page this way, but it scrolls away with the rest of the page, looks like a stray box in the middle of your docs, and behaves nothing like a floating widget that follows the visitor.
- →A browser extension. It injects the widget into your own browser only. You see a chat bubble, your visitors see nothing, and you spend a confused afternoon wondering why nobody writes in.
The two routes that actually work
Since Notion itself will not execute your script, you put a thin layer around it that will. In practice that means one of two things:
- 01Route A: a Notion site builder. Tools like Super, Potion, and similar services wrap your Notion pages, serve them on your own domain, and expose a custom code field where a script tag runs for every visitor.
- 02Route B: a tiny page you host yourself. Your domain root becomes one small HTML file with the widget on it, and it links into your public Notion pages for the heavy content.
Route A keeps everything inside Notion and costs a builder subscription. Route B costs nothing beyond a static host's free tier and ten minutes of HTML. Pick based on how central the Notion site is to your project: if it is the whole product site, take Route A; if it is mostly docs behind a landing page, Route B is enough.
Route A: install the widget through a Notion site builder
Site builders that wrap Notion (Super and Potion are the names I hear most, and there are others) exist to fix exactly this class of problem: custom domains, faster loading, proper SEO tags, and custom code injection. One honest note before you start: on most of these builders, custom code is a paid feature. If you are on a free tier, check the plan comparison before you spend time on the setup, because the code field may simply not be there yet.
First, get your snippet. Create a site in your muro dashboard after signup (the trial is 14 days, no card), and copy the widget ID from the installation screen. The snippet you need looks like this:
html<script>
(function(w,d,s,o){
w.MuroChat=o;w[o]=w[o]||function(){(w[o].q=w[o].q||[]).push(arguments)};
var j=d.createElement(s);j.async=1;j.src='https://muro.chat/widget.js';
d.getElementsByTagName('head')[0].appendChild(j);
})(window,document,'script','muro');
muro('init',{widgetId:'YOUR_WIDGET_ID'});
</script>Then, in your builder:
- 01Open the settings for your site and look for the custom code section. Builders name it differently (code injection, custom head, snippets), but it almost always lives under site settings rather than page settings.
- 02Paste the full snippet into the head field if there is one, or the end-of-body field otherwise. Both work, because the script loads async either way.
- 03Replace
YOUR_WIDGET_IDwith the ID from your muro dashboard. This is the failure I see most often: the placeholder left in place. - 04Save and republish. Most builders regenerate your site on save, but some cache aggressively. If you do not see the bubble, republish and hard refresh before assuming anything is wrong.
Open your live domain in a private window and the chat bubble should sit in the corner of every page the builder serves. The widget is about 6 KB and loads asynchronously, so it will not drag down the page speed you presumably picked a builder to improve in the first place.
Route B: a tiny wrapper page you host yourself
If a builder subscription feels like overkill for your stage, flip the architecture. Host one small HTML page at your domain root, put the widget on it, and let Notion keep serving the deep content at its public URLs. Your landing page carries the chat; your Notion pages carry the words.
The entire wrapper can be one file on any static host's free tier:
html<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Your product</title>
<!-- paste the muro snippet from above here, before </head> -->
</head>
<body>
<h1>Your product</h1>
<p>One paragraph on what it does and who it is for.</p>
<a href="https://yourname.notion.site/docs">Read the docs</a>
</body>
</html>Visitors land on a page where they can actually talk to you, then click through to Notion for the documentation. The trade-off is real: the widget exists only on pages you host, not on the Notion pages themselves. For a lot of early projects that is fine, because the landing page is where the buying questions happen, and buying questions are the ones you cannot afford to miss.
You will also run into the proxy hack: open source worker scripts that sit in front of notion.site, rewrite the HTML on the fly, and inject custom scripts into it. It works until Notion changes its markup, and then your site breaks while you are asleep. I would not build support, the part of your product where trust matters most, on top of that.
Point the AI at the docs you already wrote
Here is where the Notion setup quietly pays off. muro's AI agent answers visitors on its own, but only grounded on content you give it: your published help articles and product context. It trains by importing a URL, and your public Notion pages are exactly that. The docs you already maintain become the knowledge base, with no export step and no copy-paste migration.
- 01In your muro site settings, open the AI section and add the URLs of your public Notion pages: the FAQ, the getting started guide, the page that explains billing.
- 02muro ingests the content and grounds its answers on it. When a visitor asks something your docs cover, the AI answers directly, with your actual wording as the source.
- 03When it is not sure, or when the topic is one a human should own (refunds, account problems, an angry customer), it hands the conversation to you instead of improvising.
When you rewrite a page in Notion, import the URL again so the AI answers from the current version. Since Notion is probably where you draft everything anyway, keeping the knowledge base fresh is just editing the docs you were going to edit regardless.
Make the widget match your Notion aesthetic
Notion sites tend to be clean and quiet, and a loud default widget can look bolted on. In the widget settings you can set the accent color, position, and size, name the agent, add an avatar, and pick the visitor-facing language from more than 12 options. Two minutes of tuning makes it feel native instead of pasted in.
The pricing math for a Notion-sized project
The stack stays small. Notion you already use. A builder subscription only if you take Route A. And muro at $19 a month on Solo (up to 2 projects) or $59 on Fleet (unlimited projects). Both plans come with unlimited agents, so adding a cofounder to the inbox never changes the bill. Managed AI credits are included (1,000 a month on Solo, 3,000 on Fleet, and 1 credit is 1 AI action). If you want unlimited AI instead, paste your own Claude API key and pay Anthropic directly, with zero markup from us. Full details on pricing.
The whole setup is one honest hour: create a site in muro, paste the snippet into your builder's custom code field or your wrapper page, and import your public Notion FAQ so the AI answers from the docs you already wrote. If you want to watch the widget and the handoff behavior before touching your own site, the live demo runs the real thing.
