Using the Pre-Chat Form
The instructions below are for desktops and laptops only.
The Pre‑Chat Form lets you collect important information, such as a visitor’s name and email, before a chat starts.
This helps you:
Understand who the visitor is and what they need.
Qualify customers and filter out casual browsers.
Give agents the context they need to respond effectively.
Note: Enabling the Pre‑Chat Form usually leads to fewer chats overall, as some visitors may choose not to fill out the form.
Enabling the Pre‑Chat Form
2. Click Administration on the left navigation bar.
3. Click Chat Widget in the left submenu.
4. Under Widget Content, click Edit Content. This will open the content editor.
5. In the Widget Content editor, click Pre‑Chat under Widget State. Then, switch Enable Pre‑Chat on.
6. (Optional) Add a message above the form on your widget. Click + Add under Header Cards, choose Text Area, and enter your message.
7. Click + Add under Body Cards and select Form.
8. This adds the Form with default fields such as Name and Email. You can add fields and connect them to custom attributes. Click Save when you’re done. Your changes are effective immediately.
Customizing the form
Click the buttons under Add field to add up to 10 fields to your form.
Phone – Collect a contact number for follow-up or verification.
Department – Let visitors choose a department so their chat reaches the right team.
Note: You must create departments before including a department selection in your form. Learn more with these guides:
Creating and managing departments
Set up a Pre-Chat Form with the option to select a Department
Text and Text Area — Add questions with short or long text responses, depending on the field type you choose.
Options Choice — Provide visitors with a dropdown or radio button list to select a single option.
Multiple choice — Offer a list of options where visitors can select one or more answers.
Number — Collect a numeric answer such as quantity, a reference number, or an ID stored as a number.
Date — Let visitors pick a calendar date. When you link this field to a Custom Attribute, use a Date attribute on the contact so the answer is stored correctly.
Required fields
Click the star icon to make any field required.
Reorder fields
To reorder the fields, click the drag handle (6 dots) next to the field name and move it up or down.
Remove fields
Click the bin icon to remove a field from the form.
Save visitors’ answers to their contact profile with Custom Attributes
Note: Built-in fields such as Name, Email, Phone, and Department cannot be linked to custom attributes.
Click the Custom Attribute dropdown in a field in your form and select the relevant attribute from the list.
Only attributes that match the field type will appear in the dropdown. Supported attribute types include Long Text, Number, Date, and list-based fields (single or multiple selection).
Note: When using a Long Text attribute, visitors can enter up to 250 characters in the form. After the chat ends, agents can extend this up to the full 2048-character limit in the contact profile.
You can also select + New Custom Attribute to create a new attribute. After creating, select the new attribute from the dropdown.
- A label appears next to the field name, indicating the attribute it’s connected to.
- The Field Label and format may automatically adjust to the most suitable input type (for example, Number, Date, or list options) to match the attribute.
Saving Pre-Chat and Offline form responses to Custom Attributes in Contacts
What visitors see
Visitors will see the Pre‑Chat Form before starting a conversation. If no fields are marked as required, they can skip the form and click Start Chat. However, if you’ve set any fields as mandatory, visitors must fill them out before they can begin the chat.
If you added the Phone number field, visitors can choose their country code (from the dropdown list) and enter their phone number.
Visitors will see the labels you create for each field. The widget automatically displays the appropriate input type for every field—for example, a number field for Number, a date picker for Date, radio buttons for a single-choice list or True/False options (shown as Yes and No), checkboxes for multiple selections, and a larger text box for Long Text responses.
What agents see
When visitors submit the Pre‑Chat Form, their responses appear at the beginning of the conversation. This helps your agents understand the visitor’s needs, so they can respond quickly and offer more relevant support.
Additional considerations
Chat volume and engagement
Using the Pre‑Chat Form can reduce the number of incoming chats, as some visitors may not want to fill out a form before starting a conversation. If your goal is to maximize engagement, you might consider keeping the form disabled.
Learn how to encourage more chats in this guide: How to engage more visitors in chat
Choosing required fields
Required fields can improve data quality, but too many mandatory questions may discourage visitors. Use only the fields you truly need.
Combine with triggers or AI Assist
You can use Triggers or AI Assist to further personalize chat experiences based on form input. This is especially useful for routing or creating scripted messages.
Learn more: Using Suggested Message and AI Assist to create scripted chat sequences
Auto-fill fields with JavaScript
You can use our JavaScript API to automatically populate visitor details (such as name and email) if users are logged in on your website.
Learn more: Setting a visitor’s name and email in the Pre‑Chat Form using JavaScript API
Enabling a Pre‑Chat Form is a great way to collect the details your team needs to offer faster, more personalized support—right from the start. With the right setup, you can streamline conversations and improve the overall experience for your visitors.
If you have feedback about this article, or if you need more help:
Click the green live chat icon
Schedule a call with us
Visit our community