In this article, we’ll introduce you to Web Widget (Classic), Zendesk’s legacy embeddable customer support interface. Web Widget (Classic) allows you to add features from other Zendesk products you're using – Guide, Support, Talk, and Chat – to your website or help center, so that your customers can get immediate help from a single interface, in whatever form they like best. including:
- Search help center articles for immediate self-service.
- Submit a support request using a contact form.
- Request a callback, or view a phone number that they can call instead.
- Start a live chat with an agent.
About Web Widget (Classic)
Web Widget (Classic) is a separate web application that you embed in a web page that gives customers access your help center and the agents in your other Zendesk support channels (Support, Talk, and Chat). It can encourage customers to self-serve, whenever possible, by using help center articles. It can also make it easier to get help from an agent by reducing the number of steps required to access a contact form, request a call back, and start a chat.
All of these things can be done from a single interface. The customer doesn't need to go from your home page to your help center, open their email application, or search your website to find a email address to contact you.
You can add the Web Widget (Classic) to your website or help center. It appears in the bottom corner by default.
You must be an administrator to set up and manage the Web Widget (Classic).
The first thing you need to do is configure the components you want in the widget (see Configuring the Components in your Web Widget (Classic)), and then you can add the widget code your website or help center (see Adding Web Widget (Classic) to your website or help center).
For a complete list of documentation about the Web Widget (Classic), see Web Widget (Classic) resources.
Browser requirements for Web Widget (Classic)
Web Widget (Classic) is supported on the following browsers.
Device type | Browsers |
---|---|
Desktop computers |
|
Mobile devices |
|
Understanding the end user experience
In Web Widget (Classic), you can enable components to combine knowledge base search, live chat, phone calls, and contact forms. The end user experience depends on what options are enabled and whether agents are online.
When multiple components are enabled in the Web Widget (Classic), components are presented to end users in a specific sequence, at different times, rather than all at once.
Components are presented in this order:
For more information about how visitors can use these components, keep reading.
Self service
If the help center is enabled in the Web Widget (Classic), customers are presented with help center search first. When the Web Widget (Classic) opens, it includes both self-service and the contact button.
When you search, up to nine results appear, if matches are found. The customer can click an article in the list and it opens in Web Widget (Classic).
If Contextual Help is enabled in Web Widget (Classic), up to three suggested articles appear below the search box. The suggested articles are determined by the page URL from which the customer accessed the Web Widget (Classic), or it is chosen by the administrator using advanced customizations (see About Contextual Help for the Web Widget (Classic)).
Live chat
This is an overview about how live chat works in Web Widget (Classic) from a visitor’s perspective. It’s meant to give administrators and agents a general idea about how it works, but it doesn’t cover all scenarios—the exact appearance and behavior of live chat in Web Widget (Classic) depends on how it was configured by the administrator.
Visitors to your website can use live chat functions in Web Widget (Classic) from a desktop or mobile browser (see Customizing the Chat widget for mobile devices).
Your visitors can perform these chat-related activities from the Web Widget (Classic):
- Starting chats from Web Widget (Classic) launcher
- Receive proactive chats
- View conversation history
- Customize the avatar, name, and byline of the chat Concierge section
- Send and receive attachments with chats
- Adjust sound, request transcripts, edit contact details, and end chats
- Translate chats
- End and rate chats
- Popping out Web Widget (Classic) during chats
For more information, see Setting up Zendesk Chat in Web Widget (Classic).
Starting chats from Web Widget (Classic) launcher
When live chat is enabled in Web Widget (Classic), the appearance of the launcher to end users depends on which other contact options are enabled.
Launcher appearance | Contact options and agent availability |
![]() |
If live chat is the only contact option enabled in Web Widget (Classic) and a Chat agent is online, the launcher includes the Chat icon and says Chat. |
![]() |
If live chat and the help center are enabled, when a chat agent is online, the launcher includes the Chat icon and says Help. |
![]() |
The chat badge is a special launcher that allows a customer to get support from a chat agent immediately. If the chat badge is enabled, chat is the only contact option enabled in the Web Widget (Classic), and a Chat agent is online, the chat badge appears on the page instead of the regular Web Widget (Classic) launcher. |
If Chat is the only contact option enabled and no agents are online, the launcher does not display. |
Once the customer opens Web Widget (Classic), they see this:
When the customer clicks Live chat, what they see next depends on whether the pre-chat form is enabled.
![]() If the pre-chat form is enabled, the customer fills in the form, then clicks Start Chat |
![]() If the pre-chat form is not enabled, the customer can start the chat right away. |
If an agent is available when the customer clicks the launcher, but the then agent signs off before the chat begin, the customer sees a message indicating that the Chat agent is not available.
Receiving proactive chats
Agents can see who is the currently on your site and decide whether to proactively contact a visitor before they request a chat. For example, you might want to reach out to visitors who have items their shopping cart, but are taking too long to complete their purchases. For more information, see Browsing your site's visitors, Using Zendesk Chat, and Targeting key visitors with proactive chat.
Viewing conversation history
If visitor authentication is enabled in the Web Widget (Classic), authenticated visitors can see their past chats. For more information about visitor authentication, see Enabling authenticated visitors in the Web Widget (Classic) and Conversation history in Web Widget (Classic) for authenticated visitors.
Customize the avatar, name, and byline of the chat Concierge section
Before visitors connect with a support agent, they see the avatar, name, and byline of the chat Concierge. For more information, see Customizing the Chat widget concierge.
Sending and receiving attachments with chats
Visitors can send and receive attachments. Clicking the attachments icon () opens a standard file selection dialog box, but you can also drag and drop files into
the Web Widget too. For more information about attachments, see Managing file sending options.
Adjusting sound, requesting transcripts, editing contact details, and ending chats
Visitors can use the expandable menu at the bottom () to turn sounds on and off, request a transcript of the chat,
edit their contact details, or end the chat. For more information about transcripts, see
Automatically send chat transcripts with email piping. For more
information about editing contact details, see Editing Visitor Profile settings.
Translating chats
If Chat detects that the agent and visitor are using different languages, the Show translated link appears in the conversation. Visitors can click this link to translate the agent’s replies into their language. The translation is performed by Google Translate.
Ending and rating chats
When the visitor is ready, they can end the chat by clicking the end chat () icon. They can also end the chat from the expandable menu
(
).
Visitors can rate a chat as good or bad using the thumbs up () and thumbs down (
) icons at any time during the chat. After they rate the chat, the Leave a comment
button appears, so they can add a comment, if desired.
If the visitor doesn’t rate the chat after a little while, the agent can prompt the visitor to rate the chat by making the Rate this chat button appear.
For more information about chat ratings, see Measuring visitor satisfaction with chat rating.
Popping out Web Widget (Classic) during chats
WhenChat is enabled in the Web Widget (Classic), visitors can click the pop-out icon
() to pop-out the Web Widget (Classic) to it's own
browser window.

The Web Widget (Classic) becomes separate from the website and receives a unique URL. It can be moved around and is no longer anchored to the website.
You can share the URL to the Web Widget (Classic) popout in a range of marketing communications, inviting the user to engage directly with you without having to be on your website.
Phone calls
When Talk is enabled in Web Widget (Classic), the appearance of the launcher to end users depends on which other contact options are enabled.
Launcher appearance | Contact options and agent availability |
![]() ![]() |
If Talk is the only contact option enabled in Web Widget (Classic) and an agent is online, the launcher includes the Talk icon and says either Request a callback or Call us, depending on your configuration. |
![]() |
If Talk and the help center are enabled in Web Widget (Classic), and an agent is online, the button says Help. |
![]() |
If Talk, the help center, and Chat, or contact forms are enabled in Web Widget (Classic), and agents are online, the launcher includes a question icon and says Help. |
When Web Widget (Classic) opens, the exact appearance of Talk in Web Widget (Classic) depends on the how it's configured by the administrator and the status of agents (see Configuring Zendesk Talk settings for Web Widget (Classic)). Depending on your configuration, customers can:
- View a phone number that they can call
- Request a callback
- View the average wait time for a callback
The following examples show how Talk in Web Widget (Classic) might appear, depending on your configuration.
If Talk is the only option enabled in Web Widget (Classic) and it is configured to allow callback requests, and then you click the launcher, the callback form displays. |
If Talk is the only contact option enabled and Talk is configured for Call Us only, your phone number displays. |
If Talk and the help center are enabled, and other contact options are enabled (for example, Chat or contact form), after a help center search the customer can access Talk from the Contact us button. |
If Talk and the help center are enabled, and Chat and contact form are disabled, after a help center search the Contact us button says Request a callback (or Call us) instead. |
Contact forms
Your customers can submit a ticket from Web Widget (Classic) to receive an email reply to their inquiry. The contact form is enabled in Web Widget (Classic) by default.
By default, the contact form includes fields for the customer's name, email address, and a description of the problem. If the administrator enabled multiple ticket forms in Web Widget (Classic) (see Configuring the components in your Web Widget (Classic)), then the customer can choose from multiple ticket forms. If not, then only the default contact form appears.
Tickets submitted through Web Widget (Classic) contain the tag
web_widget
.
78 comments
Stacy Win
Is this a defect or are there any solutions for this problem?
We only use the web widget for client ticket submissions. A few clients are associated with multiple orgs. When they submit tickets, all of the tickets are associated with their default org. Which is not correct.
Should end-users that belong to multiple orgs be able to select the correct organization when submitting a ticket via the web widget?
Is there a way to force the correct org association based on the client site the web widget is used from?
0
Maky
Hi @Stacy win (there are 5 different Stacy Win!)
You can add a custom field to your web widget with the list of the orgs that you have on your instance, then with a trigger when the request in coming you can select the correct organization you need.
I think you don't refer to these organizations as brands on the Zendesk multi-brand instance, I think these organizations are a different way of classifying users on the same brand. It's correct?
Regards.
Maria
0
Stacy Win
Maky
You picked the right Stacy Win!
That is correct, I am not referring to the organizations as brands.
The only problem with the solution you provided is there are over 300 organizations and only a handful have users associated with multiple orgs.
Zendesk documentation states that if a user is associated with multiple orgs when they submit a ticket the form asks them to select the correct org. But I think that is only when the Help Center web form is being used. The web widget does not support this, which I think it should.
We associate the web widget with specific sites on the software. Is there any way with code to ensure the org is set correctly on ticket creation based on the site the web widget is used?
0
Maky
Hi again Stacy!
You can solve this in this way:
1. Add tags to your web widget associated with the " specific sites on the software" For example; you have a games site therefor you use the tag "games_site":
<!-- Start of your-web-widget Zendesk Widget script -->
<script id="ze-snippet" src="https://static.zdassets.com/ekr/snippet.js?key=xxxxxxxxxxxxx"> </script>
<!-- End of your-web-widget Zendesk Widget script -->
<script type="text/javascript">
window.zESettings = {
webWidget: {
contactForm: {
tags: ['games_site'],
},
}
};
</script>
2. Add a webhook with this configuration:
Endpoint url: https://yourinstance.zendesk.com/api/v2/tickets/{{ticket.id}}.json
Request method: PUT
Request format: JSON
Authentication: basic
3. In the ticket configuration trigger you can add a condition looking for the "games_site" tag and as an action call the webhook you created before (Notify active webhook) with this JSON body:
{
"ticket": {
"organization_id": 123456
}
}
Where the number 123456 is the id of the organization that you want to configure in the ticket. You can take it in the url of the organization. For exaple:
https://yourinstance.zendesk.com/agent/organizations/123456/tickets
I tried it and it works.
I hope it can help you.
Maky
0
Maky
Hi Stacy Win
Did you solve your problem?
Regards.
Maria
0
Dwight Bussman
heyO Dean Zhang - I recommend contacting our support team to look into this more closely. There may be some configuration specific to your account that could lead to such behavior, but they'll be able to dig in more deeply.
0
Jason Coe
We have no channels > classic > web widget available and I'm at a loss for understanding how to embed this.
1
Gavin
Our Web Widget Classic presents the user with our ticket forms if they don't get an answer to their question.
I want the user to be logged in before web widget will let them submit their ticket via web widget.
If that's not possible, how can I have the web widget load for logged-in users, but not load for non-logged-in users? Or even better, take them through the login flow before they can submit their ticket?
We already know how to make our Submit a Request button do this - logged-in users are taken directly to the web form, non-logged-in users are taken through our login flow before being taken to the web form. We want the same thing to happen with the Web Widget.
0
Mike DR
0
Krsna Musterer
Hi there!
I'm trying to implement the Classic Web Widget. It's almost working, except that when I try to submit the contact us form it shows the following in the console:
"Access to XMLHttpRequest at 'http://{OUR SUBDOMAIN}.zendesk.com/api/v2/requests' from origin 'https://{DOMAIN WHERE I'M TRYING TO IMPLEMENT THE WIDGET}' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource."
Not sure what I missed but I can't find anything here about this issue.
Help?
0
Mike DR
I've created a ticket for you. Will work with you there!
0
walter maldeghem
Hi,
is it possible to autofill the customer name field while loading the web widget with the name the customer is already logged in with [since I activated required authentication for signing in].
So ZD knows the customer name already while starting up the widget ...
Can that be configured?
My very best regards, Walter.
0
Dainne Kiara Lucena-Laxamana
Hi Walter!
Yes it's possible but would require a bit of tinkering from your dev team. Check out Matteo's guide here. Hope it helps!
0
Jonathan H.
Hello - We have configured our HelpDesk to show different articles based on whether the user is logged into our system or not. And, if they are logged in then we show different articles based on their role in our system. We would like to Web Widget to work the same way. For example, if they aren't logged in we mostly just want to allow them to see articles that tell them how to register or re-set their password. If they are logged in then we want to be able to see more specialized articles. How do we configure the web widget to serve up articles in this manner? - Jonathan
0
Arianne Batiles
Hi Jonathan H.
If you're using the classic web widget with the Help Center and article recommendations enabled, the widget will suggest articles based on the user's permissions. If an article is restricted, the widget will not display or recommend it. Hence, for your use case, you would want the articles on how to register and/or reset the password to be visible to everyone. You may check this article for reference.
0
Tonya Lafontaine
Is it possible to embed “my requests” to see status of tickets in my custom website?
Example: as a customer, after authenticating on company website, I want to go to help center (non Zendesk), but have ability to see my Zendesk requests.
0
Dwight Bussman
Tonya Lafontaine - it should be possible to do this using the List Requests endpoint of our REST API which allows authenticated end-users to see information about the tickets to which they have access (either as the requester or because they are CC'd / in the organization / etc)
Note: this requires authentication, so securing such a page would be important to ensure that users don't leverage it to view other peoples' tickets
0
Adriano Silveira
How do I embed a form to create a ticket, like HTML inline?
For example, a contact page, where ZenDesk generates a form.
The same behavior with HubSpot, where you paste the “iframe” form.
0