Before you add the Web Widget (Classic) to your website or help center, you need to decide which components you want to include in Web Widget (Classic) and then turn them on. For some components, you might need to go a step further and configure additional settings. You must be an administrator to configure components in Web Widget (Classic).
- Help center search and suggested articles
- Zendesk Chat for live chat with an agent
- Zendesk Talk for requesting a callback from an agent or viewing a phone number to
callNote: The prefill API doesn't work with the Talk callback form.
- Contact forms for filing a ticket
For information about how components are presented to end users, see the section about Understanding the end user experience. For a complete list of Web Widget (Classic) documentation, see Web Widget (Classic) resources.
This article includes these sections:
Configuring the Web Widget (Classic)
The Web Widget (Classic) includes multiple components that you can turn on or off, or customize. For example, you can add help, talk, and chat features, and contact forms. You can configure security settings, change the color of buttons and text, edit user interface text, and reposition Web Widget (Classic).
For detailed information about the components you can configure, see Configurable Web Widget (Classic) components (below).
To configure the Web Widget (Classic)
-
In Admin Center, click
Channels in the sidebar, then select Classic > Web Widget.
If you are setting up the Web Widget (Classic) for the first time, a wizard guides you through the process. Follow the on-screen prompts. After you complete the wizard, you can view and change your options, if you want, by proceeding to the next step.
If this isn't your first time setting up the Web Widget (Classic) skip this step. The wizard doesn't appear for you.
- From the Customization tab, configure your Web Widget (Classic) components (see Configurable Web Widget (Classic) components).
- When you're done configuring components, click Save.Note: Allow 10 minutes for changes to the Web Widget (Classic) to propagate and appear in the Web Widget (Classic).
Once you're done with this procedure, you're ready to complete the steps described in Adding Web Widget (Classic) to your website or help center, if you haven't already.
Configurable Web Widget (Classic) components
This table lists the Web Widget (Classic) components that you can configure from Support.
If you want to customize the Web Widget (Classic) further, it's possible to do that using the Web Widget (Classic) API, but you might need the help of a website developer. For more information, see Advanced customization of Web Widget (Classic).
Setting | Description |
---|---|
Contact form |
To allow customers to submit tickets from the Web Widget (Classic) leave the toggle on. This option is on by default. If you don't want customers to be able to submit tickets from the Web Widget (Classic), turn the toggle off. Tickets submitted through the Web Widget (Classic) contain the tag “web_widget.” You can use these options to control the name field in the default contact form and ticket forms that appear in the Web Widget (Classic).
Keep in mind that if the Ticket forms toggle is on, ticket forms replace the default contact form in the Web Widget (Classic). Also note that the Contact form component isn't available when authentication is required for the Requests and Uploads API endpoints. |
Ticket forms |
Note: Multiple ticket forms are not available on all Support plans.
To include multiple ticket forms in the Web Widget (Classic), turn the toggle on. This option only appears if the Contact form toggle is turned on. This option enables the end user to select any of your active ticket forms, instead of seeing only the default Web Widget Contact form, and allows you to customize which ticket forms are available based on the page the user is on. If you need to set up ticket forms, click the Settings link. For more information, see Using custom ticket fields and ticket forms with the Web Widget (Classic). |
Custom ticket fields |
Note: Regular expression, Date, and Multi-select custom fields cannot be used in
the Web Widget (Classic).
To select custom ticket fields that you want to
include in the Web Widget (Classic) contact form, use the drop-down list.This option only appears when you have enabled the contact form, and have at least one custom ticket field that is editable by end users. See Adding a custom ticket field. If you need to set up custom ticket fields, click the Settings link. For more information, see Using custom ticket fields and ticket forms with the Web Widget. |
Chat |
Note: You must have a Chat account to add Chat functions to the Web Widget
(Classic). If you don't have a Chat account, turning this toggle on has no
effect.
To include Chat features in the Web Widget (Classic), turn the Chat toggle on. You can click the Settings link to open the Chat dashboard (the Zendesk Chat product interface), or open Chat from a browser. From there, you will configure specific Chat features for use with the Web Widget (Classic) (see Setting up Zendesk Chat in the Web Widget (Classic)). You cannot add third-party chat applications to the Web Widget (Classic). |
Help Center |
Note: You must have a Guide account to add help center search to the Web Widget
(Classic). If you don't have a Guide account, turning on this toggle has no
affect.
To add help center search to the Web Widget (Classic), turn the toggle on. To configure help center search settings, click the Settings link. Guide will open and you'll configure settings from there. If help center search is enabled in the Web Widget (Classic), you can filter metrics for article views and searches that originate from the Web Widget (Classic). For more information, see Analyzing help center search results with Explore and Analyzing knowledge base activity with Explore. Including restricted articles in help center search results If you want to include restricted help center content in your Web Widget (Classic) results, you need to configure some other settings as well. For more information about using help center search with the Web Widget (Classic), see Using restricted help center content with the Web Widget (Classic). |
Contextual Help |
To include Contextual Help in the Web Widget (Classic), turn the toggle on. This option only appears when the Help Center toggle is turned on. Contextual Help suggests articles to the end-user that may be relevant to them, based on the page from which they accessed the Web Widget (Classic). For more information, see About contextual help for the Web Widget (Classic). |
Security settings |
To restrict help center search results in the Web Widget (Classic) to authenticated users on your website, click the Configure button and then follow the on-screen instructions. |
Talk |
To include Talk in the Web Widget (Classic), turn the toggle on. To configure Talk settings, click the Settings link. For more information, see Configuring Zendesk Talk settings for the Web Widget (Classic). |
Zendesk logo |
To remove the Zendesk logo in the Web Widget (Classic), turn the toggle off. |
Theme color |
To specify a custom color for the Web Widget (Classic), use the color picker. After you choose the color, you can close the color picker by clicking away, on any other part of the interface. |
Theme text color |
To specify a custom color for the text in the launcher, contact button, and header, use the color picker. After you choose the color, you can close the color picker by clicking away, on any other part of the interface. If you select the Use default color based on theme check box, the Web Widget (Classic) automatically chooses the text color for you based on the theme color and using an algorithm to guarantee a minimum contrast ratio as specified by the WCAG guidelines. |
Position |
To choose a position for the Web Widget (Classic), select a position from the drop-down list. If you want the Web Widget (Classic) to appear in the bottom-right corner of the page, choose Right. If you want it to appear in the lower-left corner, choose Left instead. |
Web Widget button text |
To specify the text on the Web Widget (Classic) launcher, choose one of the options from the drop-down list. |
Contact form button text |
To specify the text on the button that launches the contact form, choose one of the options from the drop-down list. ![]() |
Article Recommendations |
Note: Article Recommendations is available on Zendesk Suite plans.
To add
Article Recommendations to your Web Widget (Classic), turn the toggle on.This option only appears when the Help Center toggle is turned on. For more information, see Enabling Article Recommendations in the Web Widget (Classic). |
68 comments
Gregor Ritter
Hi,
is it possible to change the background colour of the widget? in the text area? we could not find an explanation so far.
Thank you in advance!
0
Beau P.
Hello Gregor,
The launcher, contact button, and header within the widget are responsive to the theme color you set either within your web-widget settings in the UI or via the object here https://developer.zendesk.com/api-reference/widget/settings/#color but the widget background is not responsive to these changes, nor can it otherwise be customized at this time.
Beau | Customer Advocate
Ask our Zendesk Community
0
Miranda Burford
Hi Gregor,
Thanks for the question! Miranda, the Web Widget Product Manager here. Out of interest, are you using messaging or the live chat Web Widget? If you let me know, I'd be happy to log this as a feature question on our side for future consideration. I'm assuming that you would like to customise the text colour as well (if you are setting the background colour so they work nicely together)?
Thanks,
- Miranda.
0
Miranda Burford
Hi Gregor,
Got it, thanks! Unfortunately, we don't have a solution available for this today. Can you please confirm whether you are using messaging or the live chat Web Widget? I'd like to lodge your feedback for future consideration.
Thanks,
- Miranda.
0
Gregor Ritter
Hi Miranda,
as our customers have the option to use dark mode, we need to be able to change background and text colours. At the moment we are using the widget for creating tickets, but in the upcoming months we want to activate the bot and maybe even use live chat.
If you need further information or want to take a look, which we would appreciate, we can continue the conversation via mail.
Kind regards,
Gregor
0
Miranda Burford
Thanks Gregor. That's useful information. As mentioned previously, we don't have a solution for modifying the text colour today but I'll log it as a feature request for future consideration.
- Miranda.
0
Maky
Hi Miranda Burford
We need also to change the web widget font too for branding the site.
Thanks.
Maria
0
Miranda Burford
Thanks Maky. Appreciate your feedback! Will log that on our side.
- Miranda.
0
Maky
Hi @...!
There is way to make coexist Chat and Contact form in the widget? This is whats I need:
Letting the customer choose if contact the assistance with chat or with email.
Here said that is not possible.
Thanks in advance!
Maria
0
Cheeny Aban
Yes, that is possible. You can add the
contactoptions
on your widget. This will give the customers the option to choose between the contact form and chat. More information can be found here ContactOptions API0
Michael Cybulski
Hi All,
Just wondering how I can have it that when the web widget is filled in on my website, it only goes to one agent/admins email address? At the moment when it is filled in, an alert gets sent to the email of every agent/admin on the account.
Thanks,
Michael
0
Jeff C
Hi Michael,
This is likely a default Support trigger that is sending out those email notifications which is the Notify all agents of received request. If so, you are free to customize its behaviour by simply changing the action to Email user - (name of agent) you wish to be notified.
0
Ilaria
Hi,
is it also possible to have the Web Widget translated? Our Help Center is in different languages and we would like to embed the Web Widget there, but of course adapting its language to the language that the end user is using in the Help Center.
Thanks!
0
DJ Buenavista Jr.
Thank you for reaching out to Zendesk Support.
In regards to your concern, by default, the widget language is set automatically based on the customer's browser. If the end user's browser is set to French for example, the widget will appear French for that user.
If you would like to manually set the language of the widget instead, kindly check our article How do I change or set the language in the widget on my website? for more information about this.
Thank you and have a wonderful day ahead!
Kind regards,
0
Boon Tan
The input of "Your Name" field in Web Widget (Classic) doesn't show up in the ticket. Where do I find the input field in Support Agent Workspace?
0
Ilaria
Hi @..., thank you for your reply! And regarding the custom fields of the web widget, I assume they will also be translated if we use the placeholders from the Dynamic Content?
0
DJ Buenavista Jr.
Yes, that is correct. The end-user will see everything in their own set/preferred language in their browser.
Thank you!
Kind regards,
0
Sloan
Hi there, When using the prechatForm and the offlineForm, we were able to add a custom "greeting" that would show up above the form. We have switched to using the contactForm and I can't seem to add a greeting. Here is what we are using. Any tips? Thanks!
contactForm: {
greeting: {
'*': "A Customer Service Agent is not available at this time. Please leave a message and we will get back to you via email as soon as possible during our next business day."
},
attachments: false
}
0
Greg Katechis
Hi Sloan! The contact form does not include a greeting attribute, since the greeting is part of the Chat world. When using the contact form, you're now using the Support side, which functions in a different manner and therefore only contains these options.
One option would be to use messaging instead of live chat to accomplish this, however this is a significant change for your account and may cause other unintended changes. I would recommend going through our article on which option is best for you and if you run into any questions, reach out to Advocacy team so that they can guide you in the best direction.
0
Eyal Fein
Hi,
Is there a way of changing the logo default on the widget? We have our company logo presented, however it's really skewed and doesn't look good. We prefer having our Favicon instead
0
Miranda Burford
Hi Eyal Fein,
Just so I'm clear, which logo are you trying to update? Is it the one you point to in the screenshot or the one that appears in the Web Widget itself (the one that displays to customers) on your website? If you clarify that (with a screenshot, if not the one above), that would be helpful.
Thanks!
0
Eyal Fein
Hi Miranda, thanks!
The one that appears in the web widgets, as you can see here:
0
Miranda Burford
Thanks Eyal Fein.
Would you mind uploading the logo source file (the one that's been uploaded to Zendesk) so we can investigate?
- Miranda.
0
Maky
Hi again Eyal Fein:
But if you want to get it on the chat widget you have to use concierge on the chat script configuration:
0
Mike DR
The plan you're on right now is Support Professional, the features included are different than those for Suite Professional, I just checked one of our test environment that has the Support Professional plan and it also doesn't have the option to remove the Zendesk logo.
0
Milena Rusanova
Hi Mike DR, could you please let me know since when is this option plan based? As mentioned it was previously available on Suite Professional.
Also it would be nice if such information is included in the article and we are informed that some functionality will no longer be available on certain plans, starting from XY.
Thank you!
0
Destiny
I appreciate you taking the time to discuss this matter.
It's my understanding that the removal of the logo feature was available even before the introduction of Suite packages. This privilege is exclusively offered to those on Enterprise plans. While I can't provide the exact date, I'm confident that this aligns with our established policy. For more detailed information, you may refer to the following article: How do I remove the Zendesk logo?. Despite recent updates to the article, it indicates a publication date around 2021.
I apologize for any miscommunication or misunderstanding that may have arisen around this topic. Your input is valuable, and we welcome any feedback you may have so we can pass it along to our product development team.
Thank you once again for your input.
0
Keshav Chauhan
The classic > web widget option is NOT available
0
Gabriel Manlapig
Hi Keshav,
The reason you're missing the Web Widget (Classic) is likely due to messaging being enabled. Messaging is a newer version of our older Live Chat product. To access the Web Widget (Classic), you will need to switch back to Live Chat. Would you mind trying to disable messaging by following the steps outlined in the article below:
How do I turn off messaging and go back to live chat?
I hope that helps. Thank you!
0
IT
I would like the webWidget to be minimized instead of displayed in the badge mode when I reload the page. I have customers complain that the chat keeps opening up after they minimize the badge. Any assistance with starting in the minimized icon mode would be appreciated.
0