Skip to content

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.

html
<script
  src="https://anserra.onzira.com/widget.js"
  data-anserra-key="YOUR_EMBED_KEY"
  defer
></script>

How it is isolated

The chat runs inside an iframe on the Anserra 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.

jsx
import { useEffect } from "react";

export function AnserraWidget() {
  useEffect(() => {
    const script = document.createElement("script");
    script.src = "https://anserra.onzira.com/widget.js";
    script.dataset.anserraKey = "YOUR_EMBED_KEY";
    script.defer = true;
    document.body.appendChild(script);
    return () => {
      script.remove();
      window.Anserra?.destroy();
    };
  }, []);

  return null;
}

Next.js

lazyOnload keeps the widget off your critical path so it never affects Largest Contentful Paint.

jsx
import Script from "next/script";

export default function RootLayout({ children }) {
  return (
    <html lang="en">
      <body>
        {children}
        <Script
          src="https://anserra.onzira.com/widget.js"
          data-anserra-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.

html
<iframe
  src="https://anserra.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.

javascript
// Available on window once the script has loaded
Anserra.open();              // open the chat window
Anserra.close();             // close it
Anserra.toggle();            // toggle
Anserra.sendMessage("Hi");   // send a message programmatically
Anserra.setVisitor({         // attach known-user context to leads
  name: "Ada Lovelace",
  email: "ada@example.com",
});
Anserra.on("open",  () => {});
Anserra.on("close", () => {});
Anserra.on("message", (m) => {});  // { role, content }
Anserra.destroy();           // remove the widget entirely

Before 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.