Embed script

The widget loads from one script. This page covers its attributes and how to feed it context from your page, for teams that want more control than the one-click installs give.

The script

<script
  src="https://hey.support/api/chat/embed.js"
  data-chatbot-id="YOUR_ID"
  defer
></script>

The script is a thin injector. It reads its attributes, mounts the widget in an iframe, and does nothing else. All of the agent's configuration (theme, greeting, tools) lives server-side against the Chatbot ID, so this tag never needs to change when you edit the agent.

Attributes

Passing context

data-context lets you tell the agent about the current page or visitor, so it can answer with that in mind. Pass URL-encoded JSON:

<script
  src="https://hey.support/api/chat/embed.js"
  data-chatbot-id="YOUR_ID"
  data-context="%7B%22plan%22%3A%22growth%22%2C%22order_id%22%3A%221234%22%7D"
  defer
></script>

The decoded value there is {"plan":"growth","order_id":"1234"}.

Updating context after load

For context that changes without a page reload, like a cart that updates as the visitor shops, send a postMessage to the window:

window.postMessage(
  {
    type: 'HS_SET_CONTEXT',
    payload: { cart_total: 4200, cart_item_count: 3 },
  },
  '*',
);

The widget picks it up and merges it into the visitor's context. This is the same bridge the Shopify and WordPress installs use under the hood, so the agent always has current page context.