Back to docs
Kilo offers three ways to place the chat widget on your website. Each serves a different purpose, and you can use more than one on the same site. The right choice depends on where and how you want visitors to interact with your AI agent.
This is the most popular option. It adds a small chat bubble — typically in the bottom-right corner of the screen — that appears on every page of your website. When a visitor clicks it, the chat window opens.
Best for: General lead capture across your entire site. Visitors can start a conversation from any page without navigating away.
How to install:Go to your Kilo dashboard and open Widget settings.
Copy the floating widget snippet.
Paste it into your website's global header or footer code.
Tip: You can hide the floating widget on mobile devices from the Widget settings. This is useful if the bubble overlaps a mobile CTA button like "Book a Demo."
This embeds the chat directly into a specific section of a page — so it looks like a native part of your site rather than a floating bubble. Visitors see the chat window right there on the page without having to click anything.
Best for: High-intent pages like your pricing page, a product comparison page, or a landing page where you want to engage visitors immediately.
How to install:Add an empty container element where you want the chat to appear.
Add the Kilo script with
Tip: Set a height on the container element so the chat has enough room. 400-600 pixels works well for most layouts.
A full-page chat experience with a split view — the conversation on one side and documents or resources on the other. This creates a dedicated, immersive qualification experience.
Best for: A standalone "Talk to Our AI" page, a dedicated demo request flow, or an interactive product tour.
How to install:Create a new page on your site (e.g.,
Add the fullscreen container and script.
If your team manages scripts through Google Tag Manager, you can deploy Kilo without touching your site's source code. Use the global config approach:
Add both script tags as a single Custom HTML tag in GTM, set the trigger to "All Pages," and publish. Your Kilo widget will appear on every page managed by that GTM container.
For security, the Kilo widget only loads on the domain registered in your account. If someone copies your snippet and tries to use it on a different website, it will be blocked. Localhost is always allowed so you can test before going live.
Kilo is compatible with virtually every website platform: WordPress, Webflow, Squarespace, Framer, Next.js, Gatsby, plain HTML, and more. If your site can load a JavaScript file, Kilo will work.
Common question: "Do I need a developer to install this?" In most cases, no. If you can access your website's settings and find the "custom code" or "header scripts" area, you can paste the snippet yourself. If you're unsure, forward the snippet to whoever manages your website — it takes them about 30 seconds.
Deployment Options
Deployment Modes
Kilo offers three ways to place the chat widget on your website. Each serves a different purpose, and you can use more than one on the same site. The right choice depends on where and how you want visitors to interact with your AI agent.
Floating Widget (recommended for most teams)
This is the most popular option. It adds a small chat bubble — typically in the bottom-right corner of the screen — that appears on every page of your website. When a visitor clicks it, the chat window opens.
Best for: General lead capture across your entire site. Visitors can start a conversation from any page without navigating away.
How to install:
<script src="https://kilo-sales.com/widget.js" data-site-id="abc123xyz" async></script>
Tip: You can hide the floating widget on mobile devices from the Widget settings. This is useful if the bubble overlaps a mobile CTA button like "Book a Demo."
Inline Widget
This embeds the chat directly into a specific section of a page — so it looks like a native part of your site rather than a floating bubble. Visitors see the chat window right there on the page without having to click anything.
Best for: High-intent pages like your pricing page, a product comparison page, or a landing page where you want to engage visitors immediately.
How to install:
data-mode="inline" and point it to your container.<div id="kilo-chat" style="height: 500px;"></div><script src="https://kilo-sales.com/widget.js" data-site-id="abc123xyz" data-mode="inline" data-target="kilo-chat" async></script>
Tip: Set a height on the container element so the chat has enough room. 400-600 pixels works well for most layouts.
Fullscreen Widget
A full-page chat experience with a split view — the conversation on one side and documents or resources on the other. This creates a dedicated, immersive qualification experience.
Best for: A standalone "Talk to Our AI" page, a dedicated demo request flow, or an interactive product tour.
How to install:
/chat or /assistant).<div id="kilo-full"></div><script src="https://kilo-sales.com/widget.js" data-site-id="abc123xyz" data-mode="fullscreen" data-target="kilo-full" async></script>
Google Tag Manager (GTM)
If your team manages scripts through Google Tag Manager, you can deploy Kilo without touching your site's source code. Use the global config approach:
<script>window.KiloConfig = { siteId: "abc123xyz" };
</script>
<script src="https://kilo-sales.com/widget.js" async></script>
Add both script tags as a single Custom HTML tag in GTM, set the trigger to "All Pages," and publish. Your Kilo widget will appear on every page managed by that GTM container.
Domain restrictions
For security, the Kilo widget only loads on the domain registered in your account. If someone copies your snippet and tries to use it on a different website, it will be blocked. Localhost is always allowed so you can test before going live.
Works on any website platform
Kilo is compatible with virtually every website platform: WordPress, Webflow, Squarespace, Framer, Next.js, Gatsby, plain HTML, and more. If your site can load a JavaScript file, Kilo will work.
Common question: "Do I need a developer to install this?" In most cases, no. If you can access your website's settings and find the "custom code" or "header scripts" area, you can paste the snippet yourself. If you're unsure, forward the snippet to whoever manages your website — it takes them about 30 seconds.