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! 🙂
