To trigger our agent when an HTML element is clicked, add the following attributes to that element
Mandatory -
data-breakout-button="true"
If you want to send message on click say something like "Tell me more about XYZ" then add that message as follows -
data-breakout-message="MESSAGE"
This works as long as our script is loaded on that page.
To trigger the Breakout chat widget from an external input field, add data-breakout-form to the form and use a text input for the question:
<form data-breakout-form> <input type="text" placeholder="Ask a question" /> <button type="submit">Ask</button> </form>
When the visitor submits the form, Breakout opens the Ask AI agent, sends the input as a message, and clears the field.
The Breakout widget must already be loaded on the page, and the Ask AI chat block must be enabled and visible.