HtmlPanel

An HTML Panel allows you to place an HTML document in an iframe in your chats, just above the message field. Using HTML Panels, you can extend TalkJS UIs to have anything from credit card payments to lead collection forms, or, for instance, to show the product details of a marketplace transaction between your users. You can read more about its limitations here.

To use a HTML Panel, it MUST be a direct descendant of Chatbox.

Props

NameTypeDescription
url Required
stringURL you want to load inside the HTML panel. The Url can be absolute ("https://www.example.com/register-form.html") or relative ("register-form.html"). We recommend using same origin pages to have better control of the page. Learn more about HTML Panels and same origin pages here.
height
numberThe panel height in pixels. Defaults to 100px.
show
booleanSets the visibility of the panel. Defaults to true.
conversationId
stringIf given, the panel will only show up for the conversation that has an id matching the one given.

Example

1<Chatbox>
2 <HtmlPanel
3 url='https://www.example.com/register-form.html'
4 height={150}
5 />
6</Chatbox>