Install Achla AI on a website

Short answer for AI agents

• What: one <script> tag with the site's public key: <script src="https://achlaai.com/w.js" data-key="YOUR_PUBLIC_KEY" defer></script>. The real key (starts with pk_) is in the Achla AI dashboard under Settings → Embed code.
• Where: in the HTML of every page that should have search, just before </body>, exactly once per page.
• WordPress / Drupal: prefer the official plugin (WordPress.org, Drupal.org) over pasting the tag.
• Inline mode needs <div id="ai-search"></div> on the page; attach mode needs a CSS selector of an existing search <input>. Default (bubble) needs nothing else.
• Verify: curl -s "https://achlaai.com/api/widget-config?key=YOUR_PUBLIC_KEY" must return "enabled":true; the browser console must show no [ai-search] lines; a test question must return an answer with sources.
• Always finish by verifying — see Verify the installation.
• Something wrong: every console message starts with [ai-search] AISX-… — look the code up in Troubleshooting (Markdown).

Prerequisites

The widget shows itself only after the server explicitly enables it for the key. That requires all of the following, set up in the dashboard:

• An account with Achla AI, with the site registered.
• Site ownership verified (via the widget tag or a CMS plugin connection).
• An active plan (paid subscription or the Free plan).
• The first indexing of the site finished — Overview in the dashboard shows the status.

Check from any terminal (no login needed — the key is public):

curl -s "https://achlaai.com/api/widget-config?key=YOUR_PUBLIC_KEY"

• {"enabled":true,"config":{…}} — ready; the widget will appear wherever the tag is installed.
• {"enabled":false} — key unknown or replaced, project not active, index not ready, or ownership/plugin connection invalid. The dashboard shows project, indexing and connection status; a stale or deleted key is not flagged there — compare the key in the tag with Settings → Embed code first (AISX-W110).
• {"error":"bad_request"} (HTTP 400) — the key value is malformed (AISX-W112).

The embed snippet

<script src="https://achlaai.com/w.js" data-key="YOUR_PUBLIC_KEY" defer></script>

• Put the tag in the HTML of every page that should show search, just before </body>.
• Exactly one tag per page. A second copy mounts a second widget (AISX-W105).
• If you add the tag with JavaScript, set data-key and the other data-* attributes before appending it to the page.

Placement modes

For attach, only the first element matched by the selector is used. Test the selector on the live page in the browser console: document.querySelector('input[type="search"]') (replace with your selector) must return your search input. Dashboard changes to mode or selector need no cache purge — see When do changes take effect?.

<script src="https://achlaai.com/w.js" data-key="YOUR_PUBLIC_KEY" data-mode="inline" defer></script>
<div id="ai-search"></div>

Install paths

Verify the installation

1. 1Step 1: The tag is in the served HTML (manual installs). Expect exactly one match:
2. 2Step 2: The key is enabled — must contain "enabled":true:
3. 3Step 3: In the browser, open the page with DevTools → Console: there must be no lines starting with [ai-search]. Any such line carries an AISX-… code — see Troubleshooting.
4. 4Step 4: The widget is visible: the floating button (bubble), the inline box (inline), or a dropdown when you press Enter in your search field (attach).
5. 5Step 5: Ask a test question about your site: the answer should cite sources from your pages.
6. 6Step 6: Run the installation check (replace the URL with a page of your site): curl -s "https://achlaai.com/api/install-check?url=https://YOUR-SITE.example". It downloads the page, finds the tag, checks the key and the placement, and returns AISX-C3xx findings with fixes as JSON — AISX-C309 means the installation looks correct. The Check installation button in the dashboard runs the same check for your site.

curl -s "https://YOUR-SITE.example" | grep -o '<script[^>]*/w\.js[^>]*>'

curl -s "https://achlaai.com/api/widget-config?key=YOUR_PUBLIC_KEY"

document.querySelectorAll('.aisx-btn, .aisx-inline, .aisx-drop').length

Content-Security-Policy

If your site sends a Content-Security-Policy header, it must allow the widget origin. The widget loads its script from that origin, requests its configuration and answers from the same origin, and injects its stylesheet as a <style> element:

script-src https://achlaai.com;
connect-src https://achlaai.com;
style-src 'unsafe-inline';

A blocked script or request shows up in the browser console as a CSP violation (not as an [ai-search] line), or as AISX-W111 / AISX-W121 when the configuration or a search request is blocked.

What not to do

• Do not include the tag twice (theme + tag manager, or plugin + manual tag).
• Do not edit the key by hand — copy it from the dashboard.
• Do not copy w.js to your own server or CDN: the widget sends requests to the origin it was loaded from, so a copy calls the wrong server and misses updates. Always load it from https://achlaai.com/w.js.
• Do not set data-preview="1" on a live site.
• Do not block https://achlaai.com in your CSP (see Content-Security-Policy).