Click Here For More Support

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:

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

Replace YOUR_POPUP_ID with your actual ID.

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

  • Open chat popup with a seeded message

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

  • Open and hide the input (read-only prompt)

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

Pass second argument “1” to hide the user input box.

  • Open / Close the popup

// SatisfiApp.Global.chatButtonShow();
SatisfiApp.Global.chatButtonHide();

  • Show / Hide the launcher button

// SatisfiApp.Global.chatButtonShow();
SatisfiApp.Global.chatButtonHide();

3) Add Injectors to Your UI

  • Simple Buttons

Drop this markup anywhere on your page.

// <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.

// <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

// <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')" />

4) Common Patterns

Cross-Page Injectors

Because the script runs site-wide, any element on any page can trigger chat with context preserved by the agent. Add CTAs in nav menus, hero banners, or feature cards that inject specific questions (e.g., “What can I bring in?”, “Show food near my seat”, “Ticket exchanges”)

Open With Input Hidden

Use the hidden input mode ("1") when you want a curated, non-editable starting prompt, for example, compliance-sensitive flows.

Toggle Launcher Button

If you’re presenting chat via full-screen takeovers or campaign landers, hide the launcher until the user closes the popup to avoid double entry points.

Recommended Injector Library (Examples)

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

UX & Implementation Best Practices

  • Use clear, specific prompts tied to the user’s context (“Upcoming summer festivals”, “Parking near South Entrance”) to reduce friction.

  • Make sure your agent knows the response to a seeded message you're injecting

  • Use <button> for actions, visible focus states, and aria-label for icon CTAs.

  • Load the embed once; avoid re-inserting the script on SPA route changes. If using an SPA, call injectors after each route render when needed.

  • Gracefully handle cases where SatisfiApp.Global is not yet available (queue the call or disable the button until ready).

Troubleshooting

  • Nothing happens on click: Ensure the embed script is present and loaded; check console for 404s. Wrap calls in a DOMContentLoaded or defer until window.SatisfiApp?.Global exists.

  • Methods undefined: Confirm you’re calling SatisfiApp.Global.

  • Popup ID invalid: Verify the popupId in the script URL.

  • SPA routes: On route change, do not re-inject the script; just call the methods from your components after mount.

Questions?

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

Last updated

Was this helpful?