During a recent implementation of Salesforce’s Live Agent website chat product, I decided to see how portable I could make the button & deployment code, to minimize the environment-specific changes that would have to be made.
Here is what I came up with:
<html> <body> <!-- Begin Live Agent button code --> <a id="onlineContent" href="javascript://Chat"> <!-- Online Chat Content --> </a> <div id="offlineContent"> <!-- Offline Chat Content --> </div> <script type="text/javascript"> var buttonId; function beginChat(){ liveagent.startChat(buttonId); } if (!window._laq) { window._laq = []; } window._laq.push(function(){ document.getElementById('onlineContent').onclick = beginChat; liveagent.showWhenOnline(buttonId, document.getElementById('onlineContent')); liveagent.showWhenOffline(buttonId, document.getElementById('offlineContent')); }); </script> <!-- End Live Agent button code --> <!-- Begin Live Agent deployment code --> <script type='text/javascript' src = 'https://la1c1.salesforceliveagent.com/content/g/js/39.0/deployment.js'> </script> <script type='text/javascript'> var firstName; var emailAddress; var endpointUrl; var deploymentId; var orgId; if (firstName != null) { // Sets the display name of the visitor when engaged in a chat. liveagent.setName(firstName); } if (emailAddress != null) { // Creates a custom detail called Email and sets its value. liveagent.addCustomDetail('Email', emailAddress); // Searches for a contact with an exact match to the Email custom detail. Creates a new contact if needed. Links contact to case. liveagent.findOrCreate('Contact').map('Email','Email',true,true,true).saveToTranscript('ContactId').linkToEntity('Case','ContactId'); } // Creates a custom detail called Case Origin and sets its value to Chat. liveagent.addCustomDetail('Case Origin', 'Chat'); // Creates a case and sets its origin. Associates the case to the chat transcript and opens the case in the agent console. liveagent.findOrCreate('Case').map('Origin','Case Origin',false,false,true).saveToTranscript('CaseId').showOnCreate(); // Initiates the chat liveagent.init(endpointUrl, deploymentId, orgId); </script> <!-- End Live Agent deployment code --> </body> </html>
This code should work for any Live Agent implementation. Simply do the following:
- modify the online and offline content elements as desired
- add the endpointUrl, deploymentId, and orgId from Salesforce
- populate the firstName and emailAddress variables via your website
Enjoy! 🙂