Question
When a visitor's chat connection times out but they do not close the window or tab that the widget is loaded in, then later reconnect to send a new message, the pre-chat form isn't automatically presented to them. Is there a way to require a visitor to always see the pre-chat form in the Web Widget when they reconnect after a timeout?
Answer
By default, a visitor skips the pre-chat form when they reconnect. Force the pre-chat form to appear by applying the script below, before the existing Web Widget (Classic) script:
<script>
// run whenever chat connects (or reconnects)
zE('webWidget:on', 'chat:connected', function() {
// get the current state of the chat session
let isChatting = zE('webWidget:get', 'chat:isChatting');
// check there is not already an active chat session
if (isChatting == false) {
// if not then get the current state of the widget
let widgetState = zE('webWidget:get', 'display');
// check if already in the open 'chat' state, indicating prior timeout
if (widgetState == 'chat') {
// if it is then close the widget, reset and reopen in pre-chat state
zE('webWidget', 'close');
zE('webWidget', 'reset');
zE('webWidget', 'open');
}
}
</script>
Test your workflow. If needed, apply or reapply widget settings by adding the below script after the script you added:
<script>
zE('webWidget', 'updateSettings', {
webWidget: {
chat: {
departments: {
select: 'Shopping Cart'
}
}
}
});
});
</script>
This final step uses the updateSettings API to apply or reapply the settings for the widget. In the above example, the Shopping Cart
department is applied when the widget first connects or is reconnected. This workflow is discussed in more detail in the related article: Can I reapply the department after a timed-out chat visitor reconnects?
Validate that you correctly configured this solution. Check the current state of the widget when it connects. Then close, reset, and reopen the widget to ensure the pre-chat form always shows to a reconnecting visitor.
5 comments
Maria Burt
How do I talk to someone
0
Nicole Saunders
Hi Maria -
Please see the options available here: Contacting Zendesk Customer Support
0
CJ Johnson
This answer code seems to always throw an error: "VM856:3 Uncaught ReferenceError: zE is not defined
at <anonymous>:3:1
at Object.updateUserHtmlFrame"
0
Eric Ypsilantis
Hi CJ, I would expect to see this "Uncaught ReferenceError: zE is not defined" error if the script in this article is being used without your account-specific widget snippet being in your code first.
Try adding the widget snippet from your account (on the Channels > Widget page in Support) above the script using the widget APIs - your Web Widget will need to be loaded before these zE APIs would work.
Hope this helps!
0
CJ Johnson
This solution only works if you only have a single chat department.
0