Add an AI chatbot to any website
Owlbee installs with one small snippet, so it works on any website builder that lets you add custom code. It also reads your calendar and your Google Docs and Sheets, with no extra accounts to connect.
What Owlbee connects to
Your website
One embed snippet adds the chat window to every page. It works on website builders, shop platforms and hand-coded sites.
Your calendar
Google Calendar, Outlook, iCloud or any iCal (.ics) link. Busy times are hidden from booking.
Google Docs and Sheets
Paste a share link and the document becomes training content for your chatbot.
The embed snippet
After your chatbot is trained, open it in your dashboard and click Get Embed Code. You get a short block of HTML like the one below, already filled in with your chatbot's own code, title, avatar and greeting. Paste it once into your platform's site-wide footer code area, or just before the closing </body> tag, and the chat button appears on every page. No coding is needed beyond copy and paste.
<div id="chatbot-YOUR-EMBED-CODE"></div>
<script src="https://owlbee.ai/static/js/chatbot-embed.js"></script>
<script>
ChatbotEmbed.init({
embedCode: 'YOUR-EMBED-CODE',
apiUrl: 'https://owlbee.ai/api/chat/YOUR-EMBED-CODE',
containerId: 'chatbot-YOUR-EMBED-CODE',
title: 'Ask us anything'
});
</script>
Where to paste it on each platform
| Platform | Where the snippet goes | Plan needed |
|---|---|---|
| WordPress | A header and footer code plugin such as WPCode, in the Footer box | Self-hosted: any. WordPress.com: any paid plan |
| Shopify | Edit code, theme.liquid, just before </body> | Any plan with the Online Store |
| Wix | Settings, Custom Code, Body - end, all pages | A premium plan with a connected domain |
| Squarespace | Code Injection, Footer | Core, Plus or Advanced |
| Webflow | Site settings, Custom code, Footer code | A Site plan or paid Workspace |
| Ghost | Settings, Code injection, Site footer | Any |
| HubSpot CMS | Settings, Content, Pages, Site footer HTML | Any |
| Hand-coded site | Before </body> in your layout template | None |
Add Owlbee to Wix
-
Open Custom Code
In your site's dashboard, go to Settings, then Development & integrations, then Custom Code.
-
Add the snippet
Click + Add Custom Code, paste your Owlbee snippet and give it a name such as "Owlbee chatbot".
-
Choose where it loads
Select All pages and Load code once, set the placement to Body - end, then click Apply.
-
Check your live site
Custom code only runs on your published site, and Wix only allows it on sites with a premium plan and a connected domain. If you change the site's domain later, add the snippet again.
Add Owlbee to Squarespace
-
Open Code Injection
In your site's panel, open Code Injection. Squarespace has moved this setting between menus over time, so the quickest way is to type "code injection" into the panel's search.
-
Paste into the Footer field
Paste your Owlbee snippet into Footer so it loads on every page, then click Save.
-
Check your live site
Code Injection is available on the Core, Plus and Advanced plans. It does not run on checkout pages, and scripts may not run inside the editor, so check the live site in a private window.
Add Owlbee to Webflow
-
Open Custom code
In your project, open Site settings and choose the Custom code tab.
-
Paste into Footer code
Paste the snippet into Footer code, which loads before the closing body tag, and click Save.
-
Publish
Publish your site. Site-wide custom code needs an active Site plan or a paid Workspace, and it only runs on the published site.
Ghost, HubSpot, Carrd and Square Online
Ghost: Settings, then Code injection, then paste into Site footer. HubSpot CMS: Settings, then Content, then Pages, then paste into Site footer HTML. Carrd: add an Embed element set to Code, with the style set to Hidden and the location to Body End. This needs Pro Standard or higher. Square Online: Settings, then Tracking tools, then add new code at the End of body and publish.
Some builders only allow custom code inside a boxed HTML section. GoDaddy's website builder is one example, and a floating chat window cannot work there. If your platform does not allow site-wide custom scripts, Owlbee cannot be installed on it.
Hand-coded and custom websites
Paste the snippet just before </body> in your shared layout or footer template, so it appears on every page. On a single static page, paste it into that page only. The script is loaded from owlbee.ai and the AI runs on our servers, so nothing needs installing on your hosting.
Calendars: Google, Outlook and iCloud
For appointment booking, paste your calendar's iCal address into a chatbot's calendar settings. Events count as busy, so visitors are never offered a time you already have booked. In Google Calendar, the address is in the calendar's settings as the public or secret address in iCal format. Outlook and iCloud can share a calendar as a link in the same way. You never sign in to your calendar account through Owlbee.
Google Docs and Google Sheets
Set the document's sharing to Anyone with the link can view, then paste the link into your chatbot's training sources. Owlbee imports the text of a Google Doc, or the first tab of a Google Sheet, as training content. When the document changes, import it again and retrain.