Add the Allinaa chatbot to a hand-coded HTML website
Written by the Allinaa team · Updated
If your website is a set of HTML files, a custom-built site, or a builder we don't have a guide for, this is the page for you. The whole installation is one script tag in the right place. No hosting plan or builder setting limits it.
Where the code goes: just before </body>
Sign up at bot.allinaa.com/start for the 14-day free trial and copy your code from step 5 of the setup wizard, "Install". It is one line:
<script src="https://bot.allinaa.com/widget.js" data-bot-id="your-bot-id" defer></script>Paste it on the line just before the closing </body> tag. Putting it at the end means your content is read first and the chat button arrives after. The defer attribute already tells the browser not to hold the page back while the script loads, so don't remove it, and don't change the data-bot-id value: that is how the assistant knows it belongs to your business.
Shared footer template vs. every page
How many places you paste it depends on how the site is built:
| How your site is built | Where to paste |
|---|---|
| Separate HTML files, each with its own footer | Every file, before </body>. Use your editor's search across files so none is missed. |
| A shared footer include (for example a PHP or server-side include) | Once, in the shared footer file. |
| A static site generator with layouts | Once, in the base layout that every page uses. |
A single-page app (one index.html, routes in JavaScript) | Once, in index.html. The assistant follows route changes, so it knows which page the visitor is viewing. |
A quick test that you didn't miss a file: open a few pages that are reached from search engines, not only your homepage, and look for the chat button on each.
Upload and clear caches
- Save the edited files and upload them to your web host again, by FTP, your host's file manager or your usual deploy.
- If your site sits behind a CDN or your host caches pages, purge that cache so visitors get the new files.
- Reload your site in a private browser window, which ignores your own browser's cached copy.
What the snippet contains (no secret)
The line contains three things: the address of the Allinaa script, your public bot id, and the defer attribute. There is no password, key or token in it. Anyone who views your page source can see it, as with any script on a public page, and that is fine. You can e-mail it, paste it in a chat with your developer or commit it to a public repository.
If your site sends a Content Security Policy header, it must allow scripts from https://bot.allinaa.com and requests to it, or the browser will block the assistant. The browser's developer console names the rule that blocked it.
Site builders not listed
Most builders have a setting for code on every page, under a name such as "custom code", "footer code", "code injection" or "tracking code". Paste the line there. If the builder only accepts code for the head section, that works too: the script is deferred and the assistant waits for the page body before adding its button. For platforms with their own guide, see Tilda or the full list of installation guides.
If you'd rather not edit files yourself, send the code to your web developer from your cabinet.
Check the installation
Click Check my site in your Allinaa cabinet. It reads your homepage and up to two pages it links to on the same domain, respects your robots.txt, and reports whether your code was found, not found, or the site was unreachable. If the homepage is blocked by robots.txt, the check reports it as unreachable and says why. You can also simply open a page: the status turns to installed once the assistant loads on a page of your site. For anything else, see chatbot not showing.
Frequently asked questions
Can I put the chatbot code in the head instead of before the closing body tag?
Yes. The script is deferred and the assistant waits for the page body, so the head works. Before the closing body tag is still our default suggestion.
Do I need to paste the code on every page?
Only if each page has its own footer. With a shared footer, layout or index.html, paste it once.
Is it safe to share the embed code?
Yes. It holds only the script address and your public bot id, with no password, key or token.
Does the chatbot work on a single-page app?
Yes. Paste the code once in index.html; the assistant follows route changes and knows which page the visitor is on.