Skip to main content
Skip table of contents

How to Create Custom Call Information Forms

Call Info Forms

  • If you enable call information forms, by default your callers will be asked to fill out 3 fields: 

    • Name

    • Contact Info

    • Call Reason

  • You can customize these fields and even add drop down list or checkboxes.

Step 1

  • To begin we need to enable custom call information forms.

  • On the side menu, navigate to Settings > e-Line Configuration.

Step 2

  • Under Contact Information Forms, select Use Custom Form.

  • You can make the necessary edits on the Default Form. You will see the current properties have

    • a "type" i.e. text box, drop down, etc.

    • a "title" what callers see in that field i.e. name, email, call reason etc.

    • "maxLength" the max number of characters that can be put by caller

  • In the "required" section you can choose which fields will be required for the caller to be able to start the call.

    • Properties not included here will be optional.

  • "x-ringer-fields" determines which fields you see when you receive the call.

    • Fields included here will be visible on the ringer and in the chat after you accept the call.

  • "x-order" determines the order the fields appear on the form from top to bottom.

  • For some examples see.

Help With the JSON SCHEMA Format

Basics

This section defines, how Json Schema is integrated to our form system.

Current implementation handles most of the json schema definition. We also include some additional style definition for “input masks” and ordering. To go over from an example, here is how our default form is defined as a custom schema:

CODE
{
 "title": "Thanks for contacting us! Please provide us your name, phone number, and email address, and we will connect you immediately.",
 "description": "",
 "type": "object",
 "x-order": [
    "contact",
    "contactInfo",
    "reason" 
 ],
 "required": [
    "reason",
    "contact",
    "contactInfo" 
 ],
 "properties": {
    "contact": {
       "type": "string",
       "title": "Name",
       "maxLength": 20,
    },
    "contactInfo": {
       "type": "string",
       "title": "Contact Info (Phone/Email)",
       "maxLength": 60,
    },
    "reason": {
    "type": "string",
    "title": "Call Reason",
    "maxLength": 40,
    }
 }
}

The above definition creates 3 fields: Name, Phone/Email and Reason.

Basically as Json Schema dictates, we define the fields in the properties section and set some fields as mandatory in the required section. Keys are only important to define required options and order apart from that, title field is used for each property. Global title and description can be defined too and are shown on the top of the form section.

The above fields are all text inputs. You also have the ability to get a dropdown. To define one, please use it in the following form:

CODE
{
 /* Rest of the form */
 "properties": {
    "modelInfo": {
       "type": "string",
       "title": "Interested Car Brand",
       "enum": [
          "Brand 1",
          "Brand 2",
          "Brand 3",
          "Brand 4" 
       ]
    },
 }
}

 enum field is the defining factor where. It limits the number of options can be entered in the field and creates a dropdown in the UI where user can select one of them.

You can also add a checkbox for your callers to agree on your terms and conditions, or GDPR. To define one, please use it in the following form and add it at the end of the properties section:

CODE
{
 /* Rest of the form */
 "properties": {
    /* Rest of the properties */
    "gdpr": {
       "type": "boolean",
       "title": "I accept to allow processing of my information under the <a href=\"https://link.to/your/gdpr/policy\"target=\"_blank\">GDPR</a>”,
    },
 }
}

Customizations

Additions to the default schema are following:

  • x-order: It defines the order of fields to show in the UI. It’s defined as a global field (as a sibling of title, description or properties)

    x-mask: Defines a “mask” to the input field and enforces that format on the field. It’s defined per property (as a sibling to enum, maxLength or title)

    x-placeholder: Defines a placeholder text to show on inside the field. It’s defined per property (as a sibling to enum, maxLength or title).

    x-ringer-fields: Defines fields to send during ringing notification to you. Fields defined in this section will be shown on your ringing screen. However this field is only meaningful for the questionnaire form schema.

A more complex example with the additions is like this:

CODE
{
 "title": "Thanks for contacting us! Please provide us your name, phone number, and email address, and we will connect you immediately.",
 "description": "",
 "type": "object",
 /* Based on this field, we show nameAndSurname first, then phoneNumber second and finally modelInfo */
 "x-order": [
    "nameAndSurname",
    "phoneNumber",
    "modelInfo" 
 ],
 "x-notification-fields": [
    "nameAndSurname",
    "modelInfo" 
 ],
 "required": [
    "nameAndSurname",
    "phoneNumber" 
 ],
 "properties": {
    "nameAndSurname": {
       "type": "string",
       "title": "Name and Surname",
       "maxLength": 60,
    },
    "phoneNumber": {
       "type": "string",
       "title": "Phone Number",
       /* Pattern defines in what format the input field should be. It's used in validation */
       "pattern": "\\(5[0-9]{2}\\)\\ [0-9]{3}\\ [0-9]{4}",
       /* Mask defines will enforce what will be written in the input. It's helpful when a pattern is defined. This mask requires an input to be like: (501) 111 1111 */
       /* Each element in the array represents a character. If you want to use a regex then you need to define it as an array as well (array in array)*/
       "x-mask": ["(", ["\\d"], ["\\d"], ["\\d"], ")", " ", ["\\d"], ["\\d"], ["\\d"], " ", ["\\d"], ["\\d"], ["\\d"], ["\\d"]],
       /* Placeholder is shown, when nothing is entered on the input field */
       "x-placeholder": "(5XX) XXX XXXX" 
    },
    "modelInfo": {
       "type": "string",
       "title": "Interested Brand",
       /* User will pick from a dropdown, the brand s/he is interested */
       "enum": [
          "Brand 1",
          "Brand 2",
          "Brand 3",
       ]
    },
  }
} 

Sample Customizations

Drop Down Call Reason

CODE
"reason": {
      "type": "string",
      "title": "Call Reason",
      "enum": [
       "Inquiry",
       "Product Demo",
       "Questions and Concerns"
       ]
},

 

CheckBox

CODE
"GDPR": {
     "type": "boolean",
     "title": "I understand and accept the collection of information by use of the services in accordance with <a href=\"https://11sight.com/wp-content/uploads/2020/05/11Sight-Privacy-Policy-May-2018.pdf\" target=\"_blank\">ElevenSight's Privacy Policy</a>"
    },

 

Email Input

CODE
"email": {
    "type": "string",
     "title": "Email",
     "format": "email"
    },

Drop Down Country Select

CODE
"country": {
      "type": "string",
      "title": "Country",
      "enum": [
       "Afghanistan",
  "Ă…land Islands",
  "Albania",
  "Algeria",
  "American Samoa",
  "Andorra",
  "Angola",
  "Anguilla",
  "Antarctica",
  "Antigua and Barbuda",
  "Argentina",
  "Armenia",
  "Aruba",
  "Australia",
  "Austria",
  "Azerbaijan",
  "Bahamas (the)",
  "Bahrain",
  "Bangladesh",
  "Barbados",
  "Belarus",
  "Belgium",
  "Belize",
  "Benin",
  "Bermuda",
  "Bhutan",
  "Bolivia (Plurinational State of)",
  "Bonaire, Sint Eustatius and Saba",
  "Bosnia and Herzegovina",
  "Botswana",
  "Bouvet Island",
  "Brazil",
  "British Indian Ocean Territory (the)",
  "Brunei Darussalam",
  "Bulgaria",
  "Burkina Faso",
  "Burundi",
  "Cabo Verde",
  "Cambodia",
  "Cameroon",
  "Canada",
  "Cayman Islands (the)",
  "Central African Republic (the)",
  "Chad",
  "Chile",
  "China",
  "Christmas Island",
  "Cocos (Keeling) Islands (the)",
  "Colombia",
  "Comoros (the)",
  "Congo (the Democratic Republic of the)",
  "Congo (the)",
  "Cook Islands (the)",
  "Costa Rica",
  "Croatia",
  "Cuba",
  "Curaçao",
  "Cyprus",
  "Czechia",
  "CĂ´te d'Ivoire",
  "Denmark",
  "Djibouti",
  "Dominica",
  "Dominican Republic (the)",
  "Ecuador",
  "Egypt",
  "El Salvador",
  "Equatorial Guinea",
  "Eritrea",
  "Estonia",
  "Eswatini",
  "Ethiopia",
  "Falkland Islands (the) [Malvinas]",
  "Faroe Islands (the)",
  "Fiji",
  "Finland",
  "France",
  "French Guiana",
  "French Polynesia",
  "French Southern Territories (the)",
  "Gabon",
  "Gambia (the)",
  "Georgia",
  "Germany",
  "Ghana",
  "Gibraltar",
  "Greece",
  "Greenland",
  "Grenada",
  "Guadeloupe",
  "Guam",
  "Guatemala",
  "Guernsey",
  "Guinea",
  "Guinea-Bissau",
  "Guyana",
  "Haiti",
  "Heard Island and McDonald Islands",
  "Holy See (the)",
  "Honduras",
  "Hong Kong",
  "Hungary",
  "Iceland",
  "India",
  "Indonesia",
  "Iran (Islamic Republic of)",
  "Iraq",
  "Ireland",
  "Isle of Man",
  "Israel",
  "Italy",
  "Jamaica",
  "Japan",
  "Jersey",
  "Jordan",
  "Kazakhstan",
  "Kenya",
  "Kiribati",
  "Korea (the Democratic People's Republic of)",
  "Korea (the Republic of)",
  "Kuwait",
  "Kyrgyzstan",
  "Lao People's Democratic Republic (the)",
  "Latvia",
  "Lebanon",
  "Lesotho",
  "Liberia",
  "Libya",
  "Liechtenstein",
  "Lithuania",
  "Luxembourg",
  "Macao",
  "Madagascar",
  "Malawi",
  "Malaysia",
  "Maldives",
  "Mali",
  "Malta",
  "Marshall Islands (the)",
  "Martinique",
  "Mauritania",
  "Mauritius",
  "Mayotte",
  "Mexico",
  "Micronesia (Federated States of)",
  "Moldova (the Republic of)",
  "Monaco",
  "Mongolia",
  "Montenegro",
  "Montserrat",
  "Morocco",
  "Mozambique",
  "Myanmar",
  "Namibia",
  "Nauru",
  "Nepal",
  "Netherlands (the)",
  "New Caledonia",
  "New Zealand",
  "Nicaragua",
  "Niger (the)",
  "Nigeria",
  "Niue",
  "Norfolk Island",
  "Northern Mariana Islands (the)",
  "Norway",
  "Oman",
  "Pakistan",
  "Palau",
  "Palestine, State of",
  "Panama",
  "Papua New Guinea",
  "Paraguay",
  "Peru",
  "Philippines (the)",
  "Pitcairn",
  "Poland",
  "Portugal",
  "Puerto Rico",
  "Qatar",
  "Republic of North Macedonia",
  "Romania",
  "Russian Federation (the)",
  "Rwanda",
  "RĂ©union",
  "Saint BarthĂ©lemy",
  "Saint Helena, Ascension and Tristan da Cunha",
  "Saint Kitts and Nevis",
  "Saint Lucia",
  "Saint Martin (French part)",
  "Saint Pierre and Miquelon",
  "Saint Vincent and the Grenadines",
  "Samoa",
  "San Marino",
  "Sao Tome and Principe",
  "Saudi Arabia",
  "Senegal",
  "Serbia",
  "Seychelles",
  "Sierra Leone",
  "Singapore",
  "Sint Maarten (Dutch part)",
  "Slovakia",
  "Slovenia",
  "Solomon Islands",
  "Somalia",
  "South Africa",
  "South Georgia and the South Sandwich Islands",
  "South Sudan",
  "Spain",
  "Sri Lanka",
  "Sudan (the)",
  "Suriname",
  "Svalbard and Jan Mayen",
  "Sweden",
  "Switzerland",
  "Syrian Arab Republic",
  "Taiwan (Province of China)",
  "Tajikistan",
  "Tanzania, United Republic of",
  "Thailand",
  "Timor-Leste",
  "Togo",
  "Tokelau",
  "Tonga",
  "Trinidad and Tobago",
  "Tunisia",
  "Turkey",
  "Turkmenistan",
  "Turks and Caicos Islands (the)",
  "Tuvalu",
  "Uganda",
  "Ukraine",
  "United Arab Emirates (the)",
  "United Kingdom of Great Britain and Northern Ireland (the)",
  "United States Minor Outlying Islands (the)",
  "United States of America (the)",
  "Uruguay",
  "Uzbekistan",
  "Vanuatu",
  "Venezuela (Bolivarian Republic of)",
  "Viet Nam",
  "Virgin Islands (British)",
  "Virgin Islands (U.S.)",
  "Wallis and Futuna",
  "Western Sahara",
  "Yemen",
  "Zambia",
  "Zimbabwe"
       ]
    },

JavaScript errors detected

Please note, these errors can depend on your browser setup.

If this problem persists, please contact our support.