# CAAC Go — install reference for AI agents and developers

> How to put the CAAC Go AI chat agent on a website. This document is written to
> be read by a coding agent. Everything here is stable and public; the only
> per-account value is the widget key, which the site owner supplies.

Product: CAAC Go, an AI agent that answers website visitors from the business's
own content. Docs: https://caacgo.cresclab.com/developers · Dashboard: https://caacgo.cresclab.com/app

## The key

Every workspace has a widget key (`data-key`). The owner copies it from
https://caacgo.cresclab.com/app/channels/website. It is a **public** embed key — it ships in the
HTML of every installed site, so it is not a secret and does not need to go in an
env var or a server-side proxy. Never invent or guess a key: if you do not have
one, stop and ask the owner for it.

## Option 1 — chat bubble, site-wide (this is what almost everyone wants)

```html
<script src="https://caacgo.cresclab.com/widget.js" data-key="YOUR_WIDGET_KEY" data-color="#5090FF" async></script>
```

Paste it **once**, immediately before the closing `</body>` tag, in the file
that renders the shared layout for the whole site. It then appears on every page
automatically. A floating launcher button is added; nothing else on the page is
touched.

Attributes:

| Attribute | Required | Meaning |
|---|---|---|
| `src` | yes | Must be `https://caacgo.cresclab.com/widget.js`. Do not self-host or proxy it — it is served with `max-age=0` so fixes reach installed sites immediately. |
| `data-key` | yes | The workspace's public widget key. |
| `data-color` | no | Accent colour as a 6-digit hex, e.g. `#5090FF`. Falls back to the colour saved in the dashboard. |
| `async` | recommended | The widget never blocks rendering. |

Do not add the snippet more than once — a second copy renders a second launcher.

## Option 2 — inline frame, one specific page

```html
<iframe src="https://caacgo.cresclab.com/widget/YOUR_WIDGET_KEY" width="100%" height="600" style="border:0;border-radius:12px" title="Chat"></iframe>
```

Use this only when the chat should sit **inside** a page's content rather than
float. It does not belong in the shared layout. Size it with the width/height or
with your own CSS.

## Framework notes

- **Plain HTML / static site** — the shared footer partial or template, before `</body>`. If pages are separate files with no shared include, add it to each one.
- **Any framework** — prefer the framework's standard site-wide script hook over inventing a wrapper component, but keep `src` and the `data-*` attributes byte-identical and keep it loading on every route.
- **Single-page apps** — a plain `<script>` in the HTML shell is correct. The widget attaches itself; it does not need to re-run per client-side navigation.

## Website builders

### Shopify
Easiest: connect Shopify in Integrations — the widget turns on from your theme editor, no code. Or paste the snippet via Online Store → Themes → ⋯ → Edit code → theme.liquid, just before </body>.

### WordPress
Install a header/footer scripts plugin (e.g. WPCode) and paste this into the Footer.

### Wix
Settings → Custom Code → + Add Custom Code → paste → place in “Body - end”.

### Squarespace
Settings → Advanced → Code Injection → Footer → paste there.

### Google Tag Manager
Tags → New → Custom HTML → paste the snippet → trigger “All Pages” → Save → Submit.

## Verifying the install

1. The owner clicks **Test my install** at https://caacgo.cresclab.com/app/channels/website. That fetches the live site and looks for the snippet, so it works before any visitor arrives.
2. Or check it yourself: request the deployed page and confirm the script tag is present in the returned HTML.

```bash
curl -s https://the-site.example | grep -o 'widget\.js[^>]*'
```

Two caveats on step 1:

- It scans the site's **homepage source** for the script tag, so it cannot confirm
  the **inline-frame** variant (Option 2) — that one registers when someone opens
  the page it sits on.
- Sites behind a **tag manager** inject scripts after load, so the source scan
  can't confirm them either; it reports "can't tell" rather than "missing". Open
  a page once and it registers automatically.

If the tag is in the source but the launcher does not appear, the usual causes
are: the widget is switched off in the dashboard, the site's domain is not
allowed under Settings → Security, or host CSS is hiding the launcher.

## What NOT to do

- Do not modify, rotate, or fabricate `data-key`.
- Do not vendor, bundle, or proxy `widget.js`.
- Do not install it on a single route when the owner asked for site-wide.
- Do not add a second copy "to be safe".

## Going further

- Developer API (Growth plan and up): https://caacgo.cresclab.com/developers
- OpenAPI spec: https://caacgo.cresclab.com/api/v1/openapi.json
- Agent skill: https://caacgo.cresclab.com/caac-go-skill/SKILL.md