Tips & Tricks: Custom Variables (JavaScript)

Adding extra form fields to the chat request window is located at the Setup Admin > Interface > Form Fields area. Custom variables are similar to extra form fields but are not visible on the chat request window. However, if a form field matches a custom variable, the form field value will be pre-populated with the custom variable value. Custom variables are saved with the chat transcript. If the chat is offline, custom variables will also be saved with the offline message.
Usage Scenarios
  • You can pre-populate the form fields "name", "email" and "question" using custom variables.
  • If your site contains client information that should be visible to your operators, those values can be sent to the chat request window using custom variables.
  • Any values can be sent to the chat request window using custom variables.
Pre-populate form fields or include your custom variables.
You must declare a JavaScript variable phplive_v and include the custom variables in the phplive_v object. The declaration can be placed anywhere on the HTML page, beginning, middle or before the closing </body> tag. It doesn't matter as long as it is declared somewhere on the page.
When the chat icon is clicked, The phplive_v name/value pairs will be sent to the chat request window.
  • Example code: The following JavaScript code will send the "name", "email" and "question" to the chat request window, pre-populating the name, email and question fields.
    <script data-cfasync="false" type="text/javascript">
    var phplive_v = new Object ;
    phplive_v["name"] = "John Smith" ;
    phplive_v["email"] = "j.smith@website-company-llc.com" ;
    phplive_v["question"] = "Do you sell pie?" ;
    </script>
    
  • Example code using PHP values: You can use PHP to populate the values. In this example, the PHP variable $client_name and $client_email is already known and is used to populate those values.
    <script data-cfasync="false" type="text/javascript">
    var phplive_v = new Object ;
    phplive_v["name"] = "<?php echo $client_name ?>" ;
    phplive_v["email"] = "<?php echo $client_email ?>" ;
    </script>
    
  • Example code with custom variables: Any custom variables can be sent. It doesn't have to be name, email or question. Simply add those variables to the phplive_v object. In this example, the "Client ID" and "Vendor ID" is sent to the chat request window. Those values will not be visible on the chat request window. However, if you have added an extra form field "Client ID" at the Setup Admin > Interface > Form Fields area, the "Client ID" form field value will be pre-populated and will be readonly on the chat request window.
    <script data-cfasync="false" type="text/javascript">
    var phplive_v = new Object ;
    phplive_v["Client ID"] = "<?php echo $client_id ?>" ;
    phplive_v["Vendor ID"] = "<?php echo $vendor_id ?>" ;
    </script>
    
Non-JavaScript method using URL query string custom=.
To create a custom variable URL query string, please use the following format:
-_- is the custom variable name value separator (name-_-value)
-cus- is the custom variable pair separator (name-_-value-cus-name2-_-value2)
Using the above format, custom variable URL query can be created and sent to the chat request window (phplive.php).
phplive.php?custom=name-_-value-cus-name2-_-value2-cus-name3-_-value3
Note: If the value contains special character, encode the value with PHP function urlencode() or JavaScript function encodeURIComponent()
Tips & Tricks
  • CSS Open Chat - Reference the open chat function using CSS class within the span, div or link.
  • Chat Icon Callbacks - Process your custom JavaScript code when the chat icon has loaded, has been clicked and more.
  • Transcript Action - When the chat session ends, process your custom PHP code to performan your custom actions.
  • Custom Console - Inject custom code to the operator console to add your custom widgets, actions and more.