Permalink
Switch branches/tags
Nothing to show
Find file Copy path
Fetching contributors…
Cannot retrieve contributors at this time
97 lines (70 sloc) 2.83 KB
title subtitle description
Pre-chat form
Make conversations easier for your support staff.
When chat is online visitor can write a message. Pre-chat form will show right after visitor sends first message.

Default inputs

If you are using pre-chat form, you can customize the form fields. Default inputs are name, email. If you want to disable any of them, set property loginNameControl or loginEmailControl to false.

Hide default input: name

_smartsupp.loginNameControl = false;

Hide default input: email

_smartsupp.loginEmailControl = false;

Custom fields

You can add custom fields by setting property loginControls. All filled values are sent to dashboard and displayed in Visitor info on the right side of chat panel.

  • We support 3 field types: textinput, select and checkbox.
  • Use attribute required: true to make the field mandatory for visitors.
  • Attribute name must be defined in every field and it can contain only lowercase and uppercase letters, no spaces allowed.

Attribute name is not the visible Name input but a description of custom field in the code. It can be name: "phone" or name: "group" or name: "conditons" as you will see in examples below.

Pre-chat form default

You can turn this option on in Smarstupp Dashboard > Chat box > Options{:target='_blank'} > Show pre-chat form

pre-chat form default

Pre-chat form with textinput

This field can be used for example for entering phone number.

_smartsupp.loginControls = [
  {
    xtype: "textinput",
    name: "phone",
    label: "Phone number",
    required: true
  }
];

pre-chat form default

Pre-chat form with select

You can use this customization if you have more groups (departments) like: Support, Marketing, Sales, etc.

pre-chat form with select

_smartsupp.loginControls = [
  {
    xtype: "select",
    name: "group",
    label: "Department",
    required: true,

    // use group IDs from Smartsupp dashboard
    value: "PJxWeH8LZNi", // set default group
    items: {
      "PJxWeH8LZNi": "Support",
      "tuZOw6k9Oto": "Marketing",
      "9OtIZKLaVep": "Sales"
    }
  }
];

Pre-chat form with checkbox

This can be useful in case you need your visitors to confirm something before they start chat.

pre-chat form with checkbox

_smartsupp.loginControls = [
  {
    xtype: "checkbox",
    name: "conditions",
    label: "I have read the Terms and conditions.",
    required: true
  }
];