# Browser Extension

## What is the Browser Extension

Chrome extension for querying Twig agents from any webpage.

**Features**:

* Query agents via sidebar panel
* Copy responses to clipboard
* Edit responses (Train role+)
* All queries logged to your Inbox
* Keyboard shortcut: `Cmd+Shift+K` (Mac) or `Ctrl+Shift+K` (Windows)

**Supported browsers**: Chrome, Brave, Edge (Chromium-based)

<figure><img src="/files/NTKho7uTVtgdOmOMWRxZ" alt="" width="375"><figcaption></figcaption></figure>

## Install Extension

### Step 1: Get Extension Key

1. Click your name (bottom left navigation)
2. Select **Settings**

<figure><img src="/files/y9bi4A85864czHwt8V25" alt="" width="248"><figcaption></figcaption></figure>

3. Click **Browser Extension** in sidebar

<figure><img src="/files/20yuvZGheoQHo4gicg1f" alt="" width="375"><figcaption></figcaption></figure>

4. Click **Copy Key**

**Expected result**: Key copied to clipboard (format: `ext_key_abc123...`, 64 characters)

### Step 2: Install from Chrome Web Store

1. Click **Visit Page and Install Chrome Extension** link
2. Opens Chrome Web Store: chrome.google.com/webstore/.../twig-ai
3. Click **Add to Chrome** button

<img src="/files/GwepkpimJk8aSyMx6tzA" alt="" data-size="original">

4. Confirm in popup: **Add extension**

**Expected result**: Confirmation banner "Twig AI has been added to Chrome"

<figure><img src="/files/HcQeBTS2O4xmbJTmg0tk" alt=""><figcaption></figcaption></figure>

### Step 3: Pin Extension

1. Click puzzle icon (extensions) in Chrome toolbar
2. Find "Twig AI" in list
3. Click pin icon next to it

<figure><img src="/files/Nz8zYYyLY8a5ysjH5zJg" alt=""><figcaption></figcaption></figure>

**Expected result**: Twig icon appears in toolbar (visible on all pages)

### Step 4: Configure Extension

1. Click Twig icon in toolbar
2. Sidebar opens on right side
3. Paste extension key in input field
4. Click **Connect**

**Expected result**: Status changes to "Connected", agent selector appears

## Use Extension

1. Click Twig icon or press `Cmd+Shift+K`
2. Select agent from dropdown
3. Type question
4. Press Enter

**Expected result**: Response in 2-5 seconds with citations

**Panel features**:

* Query history (last 10 queries)
* Copy button for responses
* Edit button (Train role+)
* Link to open full Playground

## Verify Installation

**Check in web app**:

1. Review → Inbox
2. Filter by source: "Extension"
3. See queries from extension with tag "chrome\_extension"

## Common Mistakes

**Symptom**: Extension shows "Invalid key" error

**Cause**: Key expired, revoked, or pasted incorrectly

**Diagnostic steps**:

1. Settings → Browser Extension → verify key still listed
2. Copy key again (old key may have been revoked)
3. Check no extra spaces before/after key

**Fix**: Regenerate key (Settings → Browser Extension → Generate New Key), paste in extension

***

**Symptom**: Extension sidebar doesn't open

**Cause**: Extension disabled or Chrome update required

**Diagnostic steps**:

1. Extensions menu (puzzle icon) → verify "Twig AI" shows "On"
2. Chrome settings → Extensions → find Twig AI → verify enabled

**Fix**: Toggle extension off/on, or reload extension (click refresh icon)

***

**Symptom**: Queries work but don't appear in Inbox

**Cause**: Extension using cached agent config, or query failed silently

**Diagnostic steps**:

1. Check extension console: Right-click Twig icon → Inspect → Console tab → look for errors
2. Verify API key has Execute scope (Settings → API Keys)

**Fix**: Reconnect extension (click Disconnect → paste key again)

## When This Doesn't Apply

**Firefox/Safari**: Not supported (Chrome Web Store extensions only). Use web app at app.twig.so instead.

**Mobile browsers**: Extensions not supported on iOS/Android Chrome. Use mobile web app (responsive design).


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://help.twig.so/product/plugins/setup-browser-extension.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.