ORYKSAORYKSADevelopers
Get API keys

Website chat

Add the AI employee to any website with one script tag: text and voice, photo, greeting and suggestions.

For customers only. This channel serves the customers of the business (questions, sales, bookings) with your Brain, products and services. It is never an interface for the owner: it does not change settings, read Activities or take orders from the owner, even if someone says they are the owner. The owner talks to ORYKSA only in the official ORYKSA app, the dashboard and the browser extension. More

Copy your widget token from the ORYKSA app (or get the ready-made code with GET /v1/widget) and paste the tag once, in the shared layout. The token is public by design: it only lets visitors chat, it cannot read or change anything.

<script src="https://app.oryksa.com/static/oryksa-widget.js"
        data-token="YOUR_WIDGET_TOKEN" data-lang="en" defer></script>
// app/layout.tsx
import Script from "next/script";

export default function RootLayout({ children }) {
  return (
    <html lang="en">
      <body>
        {children}
        <Script src="https://app.oryksa.com/static/oryksa-widget.js"
                data-token="YOUR_WIDGET_TOKEN" strategy="afterInteractive" />
      </body>
    </html>
  );
}
import { useEffect } from "react";

export default function App() {
  useEffect(() => {
    if (document.getElementById("oryksa-widget")) return;
    const s = document.createElement("script");
    s.id = "oryksa-widget";
    s.src = "https://app.oryksa.com/static/oryksa-widget.js";
    s.defer = true;
    s.setAttribute("data-token", "YOUR_WIDGET_TOKEN");
    document.body.appendChild(s);
  }, []);
  return <Routes />;
}
// nuxt.config.ts
export default defineNuxtConfig({
  app: {
    head: {
      script: [{ src: "https://app.oryksa.com/static/oryksa-widget.js", defer: true,
                 "data-token": "YOUR_WIDGET_TOKEN" }],
    },
  },
});
<!-- src/layouts/Base.astro, before </body> -->
<script is:inline src="https://app.oryksa.com/static/oryksa-widget.js"
        data-token="YOUR_WIDGET_TOKEN" defer></script>

Appearance: chosen in the app

The side of the screen (right or left), the light or dark theme, the main colour and whether visitors can drag the chat are chosen in app.oryksa.com > Connectors > Website chat. The choice is saved by itself and applies on your site at once, without changing the code.

The public endpoint GET https://app.oryksa.com/widget/api/{token}/info returns it as "style": {"position", "theme", "accent", "drag"}.

Options in the code

Attributes in the snippet still work and take priority over what is saved in the app.

AttributeDescription
data-langen, pt, pt-BR or es. By default it follows the page language.
data-positionleft or right.
data-accent, data-ink, data-paperColours in hex, to match your brand.
data-font-title, data-font-textFont families already loaded by your page.

Drag the chat

On a computer, the visitor drags the chat by its top bar to any place on the page; the position is remembered on that site. On small screens (under 900 px wide) the chat stays in its corner. You can turn dragging off in the app.

Online stores and WordPress

WordPress and WooCommerce, Shopify and Nuvemshop have their own plugin or app, which add this same chat without code: WordPress plugin, Shopify app, Nuvemshop app.

Voice replies and web channels depend on the plan. Lock the chat to your domains with PUT /v1/widget/domains or in the app. This page uses the same chat: open it in the corner.