How to Add a Notion Chatbot to Your Website (Step by Step)
· 6 min read
Your team already writes the answers. Setup guides, pricing details, policies and troubleshooting notes live in Notion, kept up to date by the people who know the product best. Your website visitors still email support, because nobody searches a help center the way they ask a question.
A Notion chatbot closes that gap. It reads the pages you choose, answers visitors in plain language on your website, and links the exact page each answer came from. This guide walks through the whole setup, from preparing your pages to reading the questions your docs still miss.
What a Notion chatbot does (and what it shouldn't)
A good docs chatbot is not a general AI that improvises. It searches your Notion pages for the passages that match a question, writes an answer only from those passages, and shows the sources so a visitor can check it.
Just as important is what happens when your docs don't cover a question. The chatbot should say so instead of guessing, and the question should land somewhere you can act on it. That is the difference between a chatbot that builds trust and one that quietly invents refund policies.
- Answers come only from the pages you shared.
- Every answer carries its sources: a link to the Notion page when it is published to the web, otherwise the exact passage it used.
- Unanswerable questions are collected for you rather than answered with a guess.
What you need before you start
- A Notion workspace with the pages you want the chatbot to answer from.
- Access to your website's HTML, or to its theme, CMS or framework (WordPress, Webflow and Next.js all work).
- A Google account to sign in. There is no password to create.
Step 1: Get your Notion pages ready
The chatbot can only be as good as the pages behind it. You don't need to rewrite your docs, but a short tidy-up pays off:
- Keep one topic per page, with a title that says what the page answers ("Refund policy", not "Misc notes").
- Use headings inside long pages. They help the chatbot find the right passage and help visitors read the source.
- Put repeated facts in one place. If your pricing is on three pages, update one and remove the others.
- Use a Notion database for FAQs or product specs. Each row becomes something the chatbot can answer from, including properties like status, plan or category.
Write the question a customer would actually ask as a heading, and the answer right below it. It is the single change that improves answers the most.
Step 2: Connect Notion and share only what the chatbot may read
Sign in with Google, then connect Notion. Notion asks which pages to share with MarketGain: pick the help center, docs or FAQ pages, not your whole workspace. The connection is read-only, and the chatbot never sees a page you didn't share.
You stay in control afterwards too. Stop sharing a page in Notion and the chatbot stops answering from it.
Step 3: Choose what the chatbot knows
Create a knowledge base and pick the Notion pages and databases it should use. Everything inside a page you pick, including nested sub-pages, comes along. MarketGain reads the content and keeps it in sync, so there is no export, copy-paste or retraining step.
Pick how often to sync: every 15 minutes, hourly or daily. Edits you make in Notion reach the chatbot on that schedule.
Step 4: Test it with real questions
Before visitors see anything, ask the chatbot the questions your support inbox gets every week. Use the customer's words, not your internal names for things. Check three things for each answer:
- Is it correct and complete?
- Does it cite the page you'd expect?
- When the docs don't cover the question, does it say so instead of improvising?
A wrong or thin answer almost always points to a page that needs a clearer heading or a missing sentence. Fix it in Notion, wait for the next sync, and ask again.
Step 5: Make it look like your brand
Give the chatbot a name, a welcome message and a few suggested questions so visitors know what to ask, and choose which corner it sits in. Then pick your brand colour, logo text and header icon. Text on the chatbot stays readable on any colour: on a light brand colour it switches to dark text automatically.
Step 6: Add the chatbot to your website
First add the domains the chatbot may run on. The chatbot only answers on those sites, so nobody can copy your snippet onto theirs. Then copy your install snippet. It looks like this, with your own key and knowledge base id:
<script
src="https://embed.marketgain.space/widget.js"
data-key="YOUR_PUBLIC_KEY"
data-knowledge-base="YOUR_KNOWLEDGE_BASE_ID"
defer
></script>- Plain HTML: paste it just before the closing </body> tag on every page that should show the chatbot.
- WordPress: use Appearance → Theme File Editor or a header & footer plugin, paste it into the footer, then clear any page cache.
- Webflow: open Site settings → Custom code, paste it into the Footer code box, and publish the site.
- Next.js: the install page gives you a <Script> version with lazyOnload, to place in app/layout.tsx.
Open your site and the chat button appears in the corner. The install page confirms once it has seen the chatbot load on your domain.
Step 7: Read the questions your docs can't answer
This is where a docs chatbot pays for itself. Every question the chatbot couldn't answer from your pages lands on the Unanswered list, so you can see exactly what visitors look for and don't find.
Work through it weekly: write the missing page or section in Notion, then mark the question as covered. After the next sync, the chatbot answers it. Over a few weeks your docs fill in around what customers actually ask, not what you guessed they'd ask.
Common mistakes to avoid
- Sharing your whole Notion workspace. Internal notes and drafts end up as sources. Share only customer-facing pages.
- Leaving old pages next to new ones. Two pages with different answers produce confused answers. Archive the outdated one.
- Testing only with your own vocabulary. Customers say "cancel my plan", not "subscription lifecycle".
- Never opening the Unanswered list. It is the cheapest roadmap for your docs you will ever get.
What it costs
You can start on the Free plan with one knowledge base and a monthly allowance of AI answers, no card needed. The MarketGain plan is $10 a month per workspace and raises the answer allowance, removes the knowledge base limit and lets you hide the "Powered by MarketGain" credit. Every feature is on both plans. See pricing for the exact quotas.
If a month's answers run out, the chatbot tells visitors it has reached its limit rather than making something up, and upgrading raises the quota immediately.
Frequently asked questions
Do I have to move my docs out of Notion? No. Notion stays your editor, and the chatbot follows your edits on its sync schedule.
What happens if I disconnect Notion? The chatbot stops answering right away, and the synced content is deleted 30 days later unless you reconnect. The security page has the details.
Does it work on any website? Yes. Anything that lets you add a script tag works, including WordPress, Webflow, Next.js and hand-written HTML.
Ready to try it on your own docs? Start free: it takes about 15 minutes from sign-in to a working chatbot on your site.