If you are using both the Chat widget and the Web Widget on your Help Center or website, you may need to manually update some Chat and Support settings to ensure the widget appears and functions as intended.
This article walks you through the updates you should make before Zendesk begins moving Chat functionality for all users to the new, integrated Web Widget.
The steps you need to perform differ, depending on whether your widgets are implemented on a Help Center or website. Use the links below to view the steps that are relevant to your implementation.
After you make these changes, your Chat functionality and the appearance of your widget may change slightly. For information on these changes, see Feature differences: Standalone Chat and Chat in the Web Widget.
Updating your Help Center implementation
If you have the Legacy Chat widget and Web Widget installed on your Zendesk Help Center, you’ll need to perform the following steps to prepare for the new Web Widget experience:
Disabling Legacy Chat in Guide
If you are displaying the Legacy Chat widget on your Help Center, you need to remove Legacy Chat from your Help Center. To do this, you need to disable the Chat widget in your Guide settings.
To disable Legacy Chat in your Guide settings
- In Guide, click the Settings icon (
) in the sidebar.
- Scroll down to Integrations, and locate the Chat entry.
- Clear the Chat check box.
- Scroll to the top of the Settings page and click Update.
Next, you’ll need to take a few steps in Zendesk Support.
Enabling and configuring the Web Widget in Zendesk Support
To make sure the Web Widget is displayed in your Help Center, you need to enable that functionality in Zendesk Support, then enable the Integrated Chat Experience in the Web Widget.
To enable the Web Widget in your Help Center
- In Zendesk Support, click the Admin icon (
) in the sidebar, then select Channels > Widget.
- Click the Setup tab, if it is not already selected.
- Click the Add to Help Center toggle.
This adds the Web Widget to the Help Center headerdocument_head.hbs
, and displays the widget on every page of your Help Center.
To enable the Integrated Chat Experience in the Web Widget
- In Zendesk Support, click the Admin icon (
) in the sidebar, then select Channels > Widget.
- Click the Customization tab, if it is not already selected.
- Click the Integrated Chat Experience toggle.
Making the Web Widget Chat-only (optional)
If you want your Web Widget to show only Chat functions, you will need to add the suppress Javascript API to below your widget snippet.
To add the Suppress API to your website
- On each page where you’ve enabled the Web Widget, find the Web Widget snippet.
- Add the following code below the snippet:
<script type="text/javascript"> window.zESettings = { webWidget: { chat: { suppress: false }, contactForm: { suppress: true }, helpCenter: { suppress: true }, talk: { suppress: true }, answerBot: { suppress: true } } }; </script>
Updating your website implementation
If you have both the Chat widget and Web Widget installed on your website, you’ll need to perform the following steps to prepare for the new Web Widget experience:
Enabling Chat in the Web Widget
To display the Integrated Chat Experience in the Web Widget, you need to enable it in Zendesk Support.
To enable the Integrated Chat Experience in the Web Widget
- In Zendesk Support, click the Admin icon (
) in the sidebar, then select Channels > Widget.
- Click the Customization tab, if it is not already selected.
- Click the Chat toggle to enable Chat functionality in the Web Widget.
- Click the Integrated Chat Experience toggle.
Removing the Chat snippet from your website
To make sure your website code is not loading unnecessary assets, you should remove the Chat snippet (also called the embed script).
To remove the Chat snippet from your website code
- In the source code of each web page displaying the Chat widget, locate the embed script. It should look something like this:
<!-- Start of DomainName Zendesk Widget script --> <script id="ze-snippet" src="https://static.zdassets.com/ekr/snippet.js?key=83775dab-6ee6-4fd7-85c0-39eb5ec114fe"> </script> <!-- End of DomainName Zendesk Widget script -->
Some older versions of Chat may have snippets that are fairly different than the example above. If you have Chat embedded in your website but cannot find the snippet above, try one of the following:
- Search your code for
<!-Start of Zendesk Chat Script->
and<!-End of Zendesk Chat Script->
. The snippet is everything between these two lines. - Search your code for references to
zopim
. Older snippets will contain multiple references.
- Search your code for
- Delete the embed script.
- Save and publish the page.
Replacing the Zendesk Chat for Wordpress or Shopify plugins
If you are using the Zendesk Chat plugins for Wordpress or Shopify, you’ll need to replace them with the Zendesk Support versions.
For information on using the Zendesk Support for Wordpress plugin, see Wordpress: Setting up and using the Zendesk Support for Wordpress plugin.
For information on using the Zendesk Support for Shopify plugin, see Shopify: Setting up Zendesk Support for Shopify integration.
7 Comments
Will you be providing us new embed codes to use on our websites come August 12th?
@Ryan
Hello,
So to confirm are you referring to something similar to the drop-down toggle located in your navbar or another integration all together? Also, would you be able to provide some screenshots to help us understand what you are trying to accomplish?
Hello!
I was reviewing the steps here and it seems like there might be an issue in the To remove the Chat snippet from your website code section.
The code snippet that is shown at the bottom of step 1 appears to be the Web Widget snippet, instead of the Chat snippet. I believe that the chat snippet (that you would want to remove) should look more like this:
Let me know if I'm missing something, but I think this is an error that could cause some confusion.
Cheers!
Hi, Curtis. I double-checked, and the included snippet is correct for most users impacted by the change in August, but we did leave out some folks who may have older snippets that look different (like the one you included). I've updated the text to hopefully clarify things.
Thanks for pointing it out!
Hi, Lauren. The section Updating your website implementation covers the steps required to get Chat enabled in your Web Widget. This article is directed at customers who already have the Web Widget running on their websites. If you don't have the Web Widget on your website yet, you can check out Adding the widget to your website for info.
Hi!
If we're using the Zendesk Chat widget -- and choose not to update our script to the new one -- will our Chat widget break? In other words, is an updating of the script crucial to its function?
The reason I ask is because some of my company's brands aren't going to be needing the new features brought by this update.
Appreciated!
Hey Dan,
You'll want to take a look at the following post submitted by one of our Chat Product Managers: Changes to Chat Widget CSP support on April 26th, 2019
The second sentence mentions the following: Don’t worry, you will not be required to change the snippet code on your website as it will happen automatically from our end.
Hope this helps!
Please sign in to leave a comment.