The Web Widget (Classic) allows you to customize the information displayed in your contact form in a number of ways. In this article, we'll discuss the following customizations:
- Adding custom ticket fields to the Web Widget (Classic) default contact form
- Removing the name field in the default contact form and ticket forms
- Making the name field in the default contact form and ticket forms a required field
- Using different ticket forms with the Web Widget (Classic)
This article includes the following topics:
Related article:
Adding custom ticket fields to the default contact form
Customers on any Support plan can choose to display one, two, or all visible, editable custom ticket fields to the Web Widget (Classic) contact form. On some usage plans, you can choose any number of custom ticket fields to display in the default contact form. For information on custom ticket fields, seeAdding custom fields to your tickets and support request forms.
System ticket fields, such as thePriorityfield, are not supported in the Web Widget (Classic). They appear in the default contact form (and any other ticket form), when accessed from the help center, but do not appear in the Web Widget (Classic). Reordering fields is supported in the Web Widget (Classic) using the ticket forms, but not in the contact form.
Regular expression, Date, andMulti-selectcustom fields cannot be used in the Web Widget (Classic).
To display custom ticket fields in the default contact form
- InAdmin Center, clickChannelsin the sidebar, then selectClassic > Web Widget.
- In theBasicstab, select theContact formcheckbox and click theCustom ticket fieldsdrop-down.
- Select the custom ticket fields you want to display in the contact form, or selectSelect all.
- ClickSave.
Enabling multiple ticket forms in the Web Widget (Classic)
If your usage plan allows, you can use multiple ticket forms in the Web Widget (Classic). For a list, and for general information about how ticket forms work, seeCreating ticket forms to support multiple request types.
Ticket forms allow you to customize the fields displayed in your contact form based on the type of request a customer makes. In order for this feature to work, you must have more than one ticket form created.
To enable ticket forms in your Web Widget (Classic)
- CInAdmin Center, clickChannelsin the sidebar, then selectClassic > Web Widget.
- In theBasicstab, select theContact formcheckbox and then select theTicket formscheckbox.
- ClickSave.
With ticket forms are toggled on, when a customer clicks the Leave us a message button, they're asked to select a form that matches their needs, from a list of all of youractive ticket forms:
When they make a selection, the contact form displays fields specific to that ticket form.
Customizing field descriptions in Web Widget (Classic)
You can addcustom ticket fields and their descriptions to the default contact form in the Web Widget (Classic).To make these appear, you must select the field from theCustom ticket fieldsoption in the Web Widget (Classic) admin settings.
However, keep in mind thatsystem fields, such as thePriorityfield, are not supported in the Web Widget (Classic). This is regardless of plan type. They appear in the default contact form, and any other ticket form, when accessed from the help center, but do not appear in the Web Widget (Classic).
票形式并不适用于所有使用计划。If available on your plan, you can also include custom fields and their descriptions in ticket forms. To make custom ticket fields and their descriptions appear, you must enable theTicket formsoption in the Web Widget (Classic) settings.
You can create and edit ticket field descriptions from theTicket Fieldsadmin page. For more information about ticket fields, seeAbout ticket fields.
To add a field description
- InAdmin Center, clickObjects and rulesin the sidebar, then selectTickets > Fields.
- Click the name of the field that needs a description.
- In theFor end userssection, clickEditable.
- Enter a description for the field, then clickUpdate field.
Advanced customization: Contextual ticket forms
You can craft more customized experiences for your users by limiting the forms the end user sees based on the web page they're currently viewing, by modifying the zESettings object in the Web Widget (Classic) JavaScript API. For information on working with the API, seeAdvanced customization of Web Widget (Classic).
In the code for the web page you want to modify, update the zESettings object to include the ID number of the ticket form(s) you want to surface. Your Ticket Forms ID is listed in the URL in the Ticket Forms admin page.
To locate a ticket form ID number
- InAdmin Center, clickObjects and rulesin the sidebar, then selectTickets > Forms.
- Click the name of the form you want to hide, or to use as your standalone form.
- Take note of the form ID in the address bar:
Use the following examples to modify your website code.
To display a single ticket form:
To display two ticket forms:
Add additional IDs to the zESettings object as needed.
Advanced customization: Pre-populating text fields
您可以使用新设置预填充某些字段s. You can use different strings for different locales, or use one string for all locales by using an asterisk (*) for the locale. This is similar to other customizable text strings like Contact Form title.
To pre-fill a system field like 'subject' and/or 'description' , update the zESettings object as shown below.
Example: Prefilled description text
Use the following code:
Example: Prefilled custom field:
Use the following code:
In this code block,id: #####
is the custom field identifier.
You can elect to always prefill a particular field in all of your forms, or prefill it separately in specific forms.
Code example: Different text for the same field in different forms:
27 Comments
I don't have any option in Channel -> Widget to add Custom Ticket Fields to the Contact Form. Where can I activate this?
Thanks for writing in. At this time with the Classic Web Widget out-of-the-box, there is no way to offer different ticket forms based on specific end-user credentials. That said, it is possible to surface specific forms in the widget's code itself using custom code, via theticketForms section of the Web Widget's Settings Reference here.However, custom scripting on the page will need to be implemented outside of ZD in order to determine what forms to then surface based on the end user's credentials which falls outside of our scope of support here.
You should be able to add a checkbox custom ticket field on the widget by making sure of the following:
As a guide, please do check the screenshot below on what it's supposed to look like:
Hope this helps! Keep safe!
Are there any plans to support multi-select ticket fields in the web widget? Not being able to use all ticket fields in the web widget is a major drag.
Hi Zendesk Team,
It would be nice to write/explain in the field creation interface that it is not possible to add this kind of fields (date, multiple selection, regex) in the web widget. We have to do it to know it..
Best regards,
So what if we want to make it so that the web widget does not display certain forms unless someone is logged into our site and their site login username (email address) matches their Zendesk login username (email address)?
Example, we have our HC code edited so that only logged in users with certain user tags can see certain forms. Is there a way to make the classic web widget mirror this?
I cannot see a "custom ticket field" in the widget customization settings.
In the Form Can we give read-only permission in custom field??
If yes how?
No, you can't change a field label that way, but you can use JavaScript to change the label in a ticket field -- here's an example that changes the labels of the Subject and Description fields, but you can do the same for a custom field by substituting
for=request_custom_fields_{id}_label
with the id for that custom field (no brackets), in place offor=request_subject
:Rename the "Subject" and "Description" labels on the Request formCan i change the custom field label name using this script like prefill?
Okay Thanks for the HelpChristopher Kennedy
I'm afraid to say that it's not possible to set the ticket's Assignee using the Web Widget, at this time. The only functionality that can help you route or assign automatically the ticket to a particular assignee, is the use ofTrigger.我们鼓励您关于th提交反馈is, by visiting thislink.
Best,
Customer Advocacy Team
Christopher KennedyThanks for the update.
Any reason why we can't change custom field title/label for end users using Web Widget API Script.
Thehintproperty allows you to specify the field's description, but it won't change the field's title/label within the widget. You may set theTitle shown to customersvalue in the ticket field's settings to display your desired field title to end-users.
How to pre-populate fields in Answer Bot form?
We have SLAs tied to assigned Priority values, we can make that an available field in the form shown through the Web Widget?
Is it possible to set assignee from Web Widget?
I tried to set id of assignee custom field but it still assigns ticket to whole group. Maybe it is because of triggers, I do not know
Thank you@...
I can change the custom field label for help center ticket form using this line of code: $('label[for=request_custom_fields_30057292]').html("Rename label");
But i want to change the custom field label for web widget.
here is the code i use to change the description and custom field hint
For web widget how can i change the custom field label using above script.
Good pointRaphaël Péguet - Officers.fr.I wonder if a list exists somewhere of what fields work in the classic web widget. Maybe hidden in the help centre.
Nice clear article listing what works and doesn't that will help us self solve rather than spend time building the form, checking in the widget, not seeing the field appear, spend 30 mins researching why it doesn't appear (with no clear answer) and then possibly raising a ticket. Perfect chance to enhance Zendesk Self Service.
添加一个复选框的方式吗?我们只使用小部件for sales question on our product web pages, but none the less, lots of support related chats come in, and we want an easy way to differentiate these at the beginning of the process?
It's not possible in a script using the Web Widget APIs. The widget will display the title of the field from admin settings.
You can custom a limited number/selection of forms by adding the snippet for the widget to a different brand.
We have 10 forms total. Brand A has 8 forms associated with it. We only want to focus on 3 of them to show up in the Help Center widget. I created a Brand B that we don't actually use, associated those 3 forms with it, and used the snippet for the Brand B widget to embed it on Help Center A.
You'd probably want to have a trigger in place to change the brand back to A, and will need assignment triggers updated if you're using brand as a condition, but this allows you to have the subset of forms you're customizing for.
Nara
https://support.zendesk.com/hc/en-us/articles/4408822236058-About-triggers-and-how-they-work
the following sentence has now been added to the article stating which fields do not work:
"Regular expression, Date, and Multi-select custom fields cannot be used in the Web Widget (Classic)."
Christopher KennedyThanks for reply.
Can I change the field's title/label using web widget script? like we do change hint/description for any field.
Pleasesign into leave a comment.