product icon

Customizing the PIN Entry Form with Instant Chat

Articles related to customization are written for a technical audience who have experience in web development. Knowledge of HTML, CSS, and JavaScript are required.

A PIN entry form with Instant Chat looks exactly like the one without the chat option. The only difference is that after the customer enters a PIN code that the technician provides, the Instant Chat window appears without downloading the Rescue Applet.

You can customize the same elements of the PIN entry whether you enable Instant Chat or not, which are the following:

  • Button caption
  • Text and text style
  • Error messages
  • Enable tracking the language and entry point of customers

The difference is that you must modify the elements at different locations in the HTML code. The following is a sample PIN entry form with Instant Chat that you can integrate into your website: 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/
TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <script type="text/javascript" src="https://secure.GoToRescue.com/InstantChat/
InstantChat.aspx"></script>
  <script type="text/javascript">
    function loadInstantChat(){
      var ICLoader = new RescueInstantChatLoader();
      ICLoader.ICContainer = "ICContainer";
      ICLoader.HostedCSS = "https://secure.GoToRescue.com/InstantChat/Standard/
InstantChat.css";
      ICLoader.HostedLanguagesForChatOnlyMode = "https://secure.GoToRescue.com/
InstantChat/LanguagesForChatOnlyMode.js";
      ICLoader.HostedLanguagesForAppletMode = "https://secure.GoToRescue.com/
InstantChat/LanguagesForAppletMode.js";
      ICLoader.PrivateCode = document.getElementById("Code").value;
      ICLoader.Tracking0 = ""; /* optional */ 
	  ICLoader.Language = ""; /* optional */ 
	  ICLoader.PostMessageTargetOrigin = null; //https://[YourSite].com<:443> 
      ICLoader.HostedErrorHandler = function(ErrorName) 
        {
        switch(ErrorName)
        {
          case "NOTECHAVAILABLE": handleError("Currently no technicians are available.
 Please check back later."); break;
          case "NOTECHWORKING": handleError("Sorry, we're closed. No technicians are
 available at this time. Please check back later during our hours of operation."); break;
          case "INVALID_PARAMETERS": handleError("Invalid parameters supplied.
 Please contact your support provider."); break;
          case "SESSIONALREADYSTARTED": handleError("A session using this PIN Code
 has already been started. Please ask your support provider for a new PIN Code."); break;
          case "UCONNECTIONERROR": handleError("Unknown connection error occurred."); break;
          case "ERRNOSUCHSSESSION": handleError("The support session cannot be started.");
 break;
          case "ERRNOSUCHENTRY": handleError("The online support session cannot be started.
 Please contact your support provider directly."); break;
          case "ERRCODEDOESNOTEXIST": handleError("PIN Code does not exist.
 Please contact your support provider."); break;
          case "ERRCODEEXPIRED": handleError("PIN Code has expired.
 Please contact your support provider."); break;
          case "ERRNOTEXPIRED": handleError("Technician or company does not exist.
 Please contact your support provider."); break;
          case "ERRMISSINGTECHLICENSE": handleError("The support session cannot be started.
 The technician is not configured to support this type of device."); break;
        }
      }
      ICLoader.Start();}
    function handleRebootOrRefresh(){
      if ((window.location + "").indexOf("Rescuewebsessionid") != -1)
{document.getElementById("ICContainer").style.display=""; loadInstantChat();} /* optional */
      if (window.location.hash.length == webSessionIdLength + 1)
{document.getElementById("ICContainer").style.display=""; loadInstantChat();} /* optional */
    }
  </script>
</head>
<body onload="handleRebootOrRefresh();">
  <span>Enter your 6-digit code: </span><input id="Code" type="text" /><br />
  <input type="button" value="Connect to technician" onclick="document.getElementById
('ICContainer').style.display=''; loadInstantChat();" />
  <div id="ICContainer" style="position: absolute; left: 0px; top: 0px; width: 400px;
 height: 500px; display: none"></div>
</body>
</html>

You find this code sample in the Administration Center on the Resources tab under Custom logmein123.com form with self-hosted Instant Chat.

Related Articles
Article last updated: 11 November, 2022