> For the complete documentation index, see [llms.txt](https://docs.satisfilabs.com/resource-center/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.satisfilabs.com/resource-center/ai-agent-engine/features-and-integrations/features/web-injectors.md).

# Web Injectors

### Overview

A unique feature that allows buttons (or any web CTAs) on the website to inject questions directly into the chat, guiding users back into the conversation and creating a cohesive user journey.

### Key Capabilities

* Universal integration with any website element (buttons, menus, CTAs, images)
* Instant prompt injection that maintains conversation context
* Customizable triggers that align with your business objectives
* Cross-page functionality that works throughout your entire website

### Implementation Guide

**Prerequisites**

* Your **Popup ID** (provided by your Satisfi Account Manager)
* Ability to add a script to your site (in `<head>` or before `</body>`)

#### 1) Install the Embed Script

Place this on every page where you want Injectors to work:

```html
<script id="satisfiScript" src="https://chat.satis.fi/popup/embedder?popupId=YOUR_POPUP_ID"></script>
```

Replace `YOUR_POPUP_ID` with your actual ID.

{% hint style="warning" %}
**One agent per page.** Load exactly one `popupId` on a page. If the site already loads a Satisfi agent site-wide, use that one and don't add a second embed. Two embeds on one page collide, and the chat will not open reliably.
{% endhint %}

#### 2) Popup Control API

All controls live on `window.SatisfiApp.Global` once the embed loads. Call these from inline handlers or your JS.

[Here's a link to the popup injector controls demo](https://d2.satisfi6.com/html/popup_injection_demo.html)

| Call                                    | What it does                                                                      |
| --------------------------------------- | --------------------------------------------------------------------------------- |
| `chatPopupOpen()`                       | Opens the chat empty                                                              |
| `chatPopupOpen(text)`                   | Opens the chat and sends `text` as the visitor's question                         |
| `chatPopupOpen(text, "1")`              | Sends `text` without showing it as a visitor message (the text box stays visible) |
| `chatPopupOpen(text, "1", displayText)` | Sends `text` hidden and shows `displayText` in its place                          |
| `chatPopupClose()`                      | Closes the chat                                                                   |
| `chatButtonShow()` / `chatButtonHide()` | Shows or hides the floating launcher button                                       |

* **Open chat popup with a seeded message**

```javascript
SatisfiApp.Global.chatPopupOpen("Where should I park?");
```

* **Open with a hidden message**

```javascript
SatisfiApp.Global.chatPopupOpen("Show me kid-friendly dining near downtown", "1");
```

Pass `"1"` as the second argument to send the message without showing it in the chat. The visitor sees only the reply. The text box stays visible.

* **Trigger a specific response and show friendly text**

```javascript
SatisfiApp.Global.chatPopupOpen("response_name=YOUR_RESPONSE_NAME", "1", "Where should I park?");
```

Sends `response_name=` hidden so the chat returns that exact response, and shows the third argument as the visitor's question. Replace `YOUR_RESPONSE_NAME` with the response's name from the Satisfi console.

* **Open / Close the popup**

```javascript
SatisfiApp.Global.chatPopupOpen();
SatisfiApp.Global.chatPopupClose();
```

* **Show / Hide the launcher button**

```javascript
SatisfiApp.Global.chatButtonShow();
SatisfiApp.Global.chatButtonHide();
```

{% hint style="danger" %}
Call `chatButtonShow()` / `chatButtonHide()` once, never on a timer or loop. Each call sends a request to Satisfi, and calling it repeatedly can generate 100+ requests per page load.
{% endhint %}

{% hint style="info" %}
**Wait for the chat to load.** These calls do nothing (and show no error) until both `SatisfiApp.Global` and `#divSatisfiChat` exist on the page. Inline button handlers are fine because visitors click after the page loads. If you call the API from your own script on page load, check for both first. See the [Chat as Search guide](https://docs.satisfilabs.com/resource-center/ai-agent-engine/features-and-integrations/features/web-injectors/agent-as-search-client-resource-guide/chat-as-search-technical-implementation-guide) for a ready-made handler.
{% endhint %}

#### 3) Add Injectors to Your UI

* **Simple Buttons**

Drop this markup anywhere on your page.

```html
<button onclick="SatisfiApp.Global.chatPopupOpen('What’s the best route to Gate D95?')">
  Find my gate route
</button>

<button onclick="SatisfiApp.Global.chatPopupOpen('Show me premium ticket options', '1')">
  Premium tickets
</button>

<button onclick="SatisfiApp.Global.chatPopupClose()">
  Close assistant
</button>
```

* **B. Editable Prompt (Vanilla JS)**

Put the default text in the input value. Read it on click. jQuery is optional.

```html
<input id="ask" type="text" value="Family restaurants near Main Street?" />
<button onclick="SatisfiApp.Global.chatPopupOpen(document.getElementById('ask').value)">
  Ask
</button>
```

* **C. Link or Image Injector**

```html
<a href="#" onclick="SatisfiApp.Global.chatPopupOpen('Buy season tickets'); return false;">
  Buy Season Tickets
</a>

<img src="/img/seasontix.png" alt="SeasonTix"
     style="cursor:pointer"
     onclick="SatisfiApp.Global.chatPopupOpen('Buy season tickets')" />
```

#### Recommended Injector Library (Examples)

**Hero CTA / Discovery**

```html
<button onclick="SatisfiApp.Global.chatPopupOpen('What can I ask about?')">
  What can I ask about?
</button>
```

**Tickets & Commerce**

```html
<button onclick="SatisfiApp.Global.chatPopupOpen('Show me Friday tickets')">
  Friday Tickets
</button>
```

**Venue Support**

```html
<button onclick="SatisfiApp.Global.chatPopupOpen('Bag policy and entry times')">
  Entry policies
</button>
```

**F\&B Upsell**

```html
<button onclick="SatisfiApp.Global.chatPopupOpen('Best vegetarian options')">
  Best vegetarian options available
</button>
```

#### Related

* [Deep Links — Open Chat from Any Link (SFX Parameters)](https://docs.satisfilabs.com/resource-center/ai-agent-engine/features-and-integrations/features/web-injectors/deep-links-open-chat-from-any-link-sfx-parameters): the same injection from a URL. Use it for emails, QR codes and SMS, with no code on the page.
* [Chat as Search — Technical Implementation Guide](https://docs.satisfilabs.com/resource-center/ai-agent-engine/features-and-integrations/features/web-injectors/agent-as-search-client-resource-guide/chat-as-search-technical-implementation-guide): an injector built as a search bar.

#### Questions?

Reach out to your Account Manager for more details. They will connect you with our Conversational Agency Services team.