Embed SDK
Put a chatbot on any website, and control it from your own code.
One script tag
Paste this before the closing </body> tag on every page where the chatbot should appear. Find your embed key on the chatbot's Embed tab.
<script
src="https://botforge.onzira.com/widget.js"
data-botforge-key="YOUR_EMBED_KEY"
defer
></script>How it is isolated
The chat runs inside an iframe on the BotForge origin. Your page's CSS cannot leak in and break the widget, and the widget cannot read your page's DOM. The only channel between them is a narrow message protocol where both sides verify the origin.
React
Mount once near the root of your app. The cleanup removes the widget on unmount so it survives fast refresh.
import { useEffect } from "react";
export function BotForgeWidget() {
useEffect(() => {
const script = document.createElement("script");
script.src = "https://botforge.onzira.com/widget.js";
script.dataset.botforgeKey = "YOUR_EMBED_KEY";
script.defer = true;
document.body.appendChild(script);
return () => {
script.remove();
window.BotForge?.destroy();
};
}, []);
return null;
}Next.js
lazyOnload keeps the widget off your critical path so it never affects Largest Contentful Paint.
import Script from "next/script";
export default function RootLayout({ children }) {
return (
<html lang="en">
<body>
{children}
<Script
src="https://botforge.onzira.com/widget.js"
data-botforge-key="YOUR_EMBED_KEY"
strategy="lazyOnload"
/>
</body>
</html>
);
}Inline instead of floating
Use the iframe embed to place the chat inside a page rather than as a floating launcher.
<iframe
src="https://botforge.onzira.com/embed/YOUR_EMBED_KEY"
title="Your chatbot"
width="400"
height="600"
frameborder="0"
allow="clipboard-write"
style="border:0;border-radius:16px;box-shadow:0 12px 40px rgba(15,23,42,.16)"
></iframe>JavaScript API
Available on window once the script has loaded.
// Available on window once the script has loaded
BotForge.open(); // open the chat window
BotForge.close(); // close it
BotForge.toggle(); // toggle
BotForge.sendMessage("Hi"); // send a message programmatically
BotForge.setVisitor({ // attach known-user context to leads
name: "Ada Lovelace",
email: "ada@example.com",
});
BotForge.on("open", () => {});
BotForge.on("close", () => {});
BotForge.on("message", (m) => {}); // { role, content }
BotForge.destroy(); // remove the widget entirelyBefore you go live
- Add your domains under the chatbot's Security tab. The embed key identifies a chatbot but does not authenticate — without a domain allowlist, anyone with the key can spend your message quota on their own site.
- Publish the chatbot. An unpublished bot loads but refuses to answer.
- Set a per-visitor rate limit appropriate to your traffic.