In this blog, I will show one of the coolest features of the console to disable the close record action on Lightning experience. In this example, if any high priority cases are created, case description is required to close the tab otherwise we will be disabling the close icon on the tab. we can use a console API to prevent agents from closing tabs until they’ve completed all required work on a case. The console API can disable a tab from closing using the disableTabClose method. You can prevent tabs from being closed in two ways:
Disable a primary tab. Its subtabs remain unlocked unless disableTabClose is invoked on them individually.
Disable a subtab. This also disables its enclosing primary tab.
disableTabClose is fully supported when you click the close-tab icon or when invoked via API. Other ways of invoking it aren’t fully supported and may not behave as you want them to. Macros aren’t fully supported. If disableTabClose is invoked via a macro, the error message might not appear, but the agent still won’t be able to close the tab in most cases. And of course, we can only lead a horse to water. An agent can still close the browser window. But hey, can’t say we didn’t try!
Tab behavior when records are deleted
When a primary tab is disabled and its record is deleted, that whole set of tabs (primary + subtabs) automagically closes.
When a subtab is disabled and its record is deleted, the subtab remains open but refreshes as a blank tab (although any sidebar components will render).
Code
Here is the simple code.
public class DisableCloseTab {
public static DisableCloseTabService service = new DisableCloseTabService();
@AuraEnabled
public static boolean disableCase(String caseId){
return service.getDisbaleStatus(caseId);
}
}
public class DisableCloseTabService {
public boolean getDisbaleStatus(String caseId){
Case c = [Select id ,Priority , Description from Case where Id = :caseId];
if(c.Priority=='High' && c.Description==null){
return true ;
}else{
return false ;
}
}
}
In this blog, I am going to explain how to use the live agent deployment API to find and create records and how to customize chat buttons and chat window. Live agent deployment API has the number of options to customize the live agent like Logging and controlling the live agent online and offline behaviors and allow automatically creating records and suggest the knowledge article etc. Below is the code from where you will launch your live agent normally it might be your webpage or visual force page from sites etc.
<apex:page sidebar="false">
<head>
<style> body { margin: 25px 0 0 25px; } </style>
</head>
<body>
<!--Deployments-->
<script type='text/javascript' src='https://c.la1-c1-iad.salesforceliveagent.com/content/g/js/41.0/deployment.js'></script>
<!--Chat Buttons & Invitations -->
<!--Customize Chat Buttons with the Deployment APIs-->
<img id="liveagent_button_online_5736A000000gBrn" style="display: none; border: 0px none; cursor: pointer"
onclick="liveagent.startChat('5736A000000gBrn')" src="https://5dfg34-developer-edition.na50.force.com/resource/1505938566000/ttttteee__Chat_Agent_Online" />
<img id="liveagent_button_offline_5736A000000gBrn" style="display: none; border: 0px none; "
src="https://5dfg34-developer-edition.na50.force.com/resource/1505938566000/ttttteee__Chat_Agent_Online" />
<script type="text/javascript">
if (!window._laq) { window._laq = []; }
window._laq.push(function(){liveagent.showWhenOnline('5736A000000gBrn', document.getElementById('liveagent_button_online_5736A000000gBrn'));
liveagent.showWhenOffline('5736A000000gBrn', document.getElementById('liveagent_button_offline_5736A000000gBrn'));
});</script>
<script type='text/javascript'>
/* Adds a custom detail called Contact Email and sets it value to testuser@gmail.com */
liveagent.addCustomDetail('Contact E-mail', 'testuser@gmail.com');
/* Creates a custom detail called First Name and sets the value to test */
liveagent.addCustomDetail('First Name', 'test');
/* Creates a custom detail called Last Name and sets the value to user */
liveagent.addCustomDetail('Last Name', 'user');
/* Creates a custom detail called Phone Number and sets the value to 415-555-1212 */
liveagent.addCustomDetail('Phone Number', '415-555-1212');
/* An auto-query that searches Contacts whose Email field exactly matches 'testuser@gmail.com'. If no result is found, it will create a Contact record with the email, first name, last name, and phone number fields set to the custom detail values. */
liveagent.findOrCreate('Contact').map('Email','Contact E-mail',true,true,true).map('FirstName','First Name',false,false,true).map('LastName','Last Name',false,false,true).map('Phone','Phone Number',false,false,true);
/* The contact that's found or created will be saved or associated to the chat transcript. The contact will be opened for the agent in the Console and the case is linked to the contact record */
liveagent.findOrCreate('Contact').saveToTranscript('ContactId').showOnCreate().linkToEntity('Case','ContactId');
/* Creates a custom detail called Case Subject and sets the value to 'Refund policy for products' and will perform a knowledge search when the chat is accepted for the agent */
liveagent.addCustomDetail('Case Subject','Refund policy for products').doKnowledgeSearch();
/* Creates a custom detail called Case Status and sets the value to 'New' */
liveagent.addCustomDetail('Case Status','New');
/* This does a non-exact search on cases by the value of the 'Case Subject' custom detail If no results are found, it will create a case and set the case's subject and status.
The case that's found or created will be associated to the chat and the case will open in the Console for the agent when the chat is accepted */
liveagent.findOrCreate('Case').map('Subject','Case Subject',true,false,true).map('Status','Case Status',false,false,true).saveToTranscript('CaseId').showOnCreate();
liveagent.addCustomDetail('InquiryDetails', 'Suport').saveToTranscript('Inquiry_Details__c');
/* For internal or technical details that don't concern the agent, set showToAgent to false to hide them from the display. */
liveagent.addCustomDetail('VisitorHash', 'c6f440178d478e4326a1', false);
/* Sets the display name of the visitor in the agent console when engaged in a chat */
liveagent.setName('Test User');
/* Sets the width of the chat window to 500px */
liveagent.setChatWindowWidth(10);
/* Sets the height of the chat window to 500px */
liveagent.setChatWindowHeight(10);
liveagent.init('https://d.la1-c1-iad.salesforceliveagent.com/chat', '5726A000000gPLj', '00D6A000000vnuz');
liveagent.enableLogging();
</script>
</body>
</apex:page>
Understand the code
Live agent logging will be very useful if you wanted to troubleshoot the live agent. You can enable the Logging by simple liveagent.enableLogging(); the method which results in the debugging as shown below on browser console.
The below piece of code shown what to do when the agent is online or offline.The showWhenOnline or showWhenOffline method to specify customers see when a particular button is online or offline based on the agent status. the below code we specify the button id to show the status liveagent_button_online_5736A000000gBrn , liveagent_button_offline_5736A000000gBrn .
Find and Create Records Use the Deployment API to search for or create Salesforce records like a case, contact, account, or lead automatically when an agent begins a chat with a customer.addCustomDetailmethods as Adds a new custom detail for the chat visitor.
/* Adds a custom detail called Contact Email and sets it value to testuser@gmail.com */
liveagent.addCustomDetail('Contact E-mail', 'testuser@gmail.com');
/* Creates a custom detail called First Name and sets the value to test */
liveagent.addCustomDetail('First Name', 'test');
/* Creates a custom detail called Last Name and sets the value to user */
liveagent.addCustomDetail('Last Name', 'user');
/* Creates a custom detail called Phone Number and sets the value to 415-555-1212 */
liveagent.addCustomDetail('Phone Number', '415-555-1212');
The Custom Detail is displayed to agents in the footer widget and in the Chat Details page in the Salesforce Console while the chat is active as shown below.
Use the findOrCreatemethod to find existing records or create new ones based on certain criteria. The findOrCreate method begins the API call that finds existing records or creates new records when an agent begins a
chat with a customer. The below code show to find and create records and store it to the live agent transcript and suggesting the knowledge articles.
/* An auto-query that searches Contacts whose Email field exactly matches 'testuser@gmail.com'. If no result is found, it will create a Contact record with the email, first name, last name, and phone number fields set to the custom detail values. */
liveagent.findOrCreate('Contact').map('Email','Contact E-mail',true,true,true).map('FirstName','First Name',false,false,true).map('LastName','Last Name',false,false,true).map('Phone','Phone Number',false,false,true);
/* The contact that's found or created will be saved or associated to the chat transcript. The contact will be opened for the agent in the Console and the case is linked to the contact record */
liveagent.findOrCreate('Contact').saveToTranscript('ContactId').showOnCreate().linkToEntity('Case','ContactId');
/* Creates a custom detail called Case Subject and sets the value to 'Refund policy for products' and will perform a knowledge search when the chat is accepted for the agent */
liveagent.addCustomDetail('Case Subject','Refund policy for products').doKnowledgeSearch();
/* Creates a custom detail called Case Status and sets the value to 'New' */
liveagent.addCustomDetail('Case Status','New');
/* This does a non-exact search on cases by the value of the 'Case Subject' custom detail If no results are found, it will create a case and set the case's subject and status.
The case that's found or created will be associated to the chat and the case will open in the Console for the agent when the chat is accepted */
liveagent.findOrCreate('Case').map('Subject','Case Subject',true,false,true).map('Status','Case Status',false,false,true).saveToTranscript('CaseId').showOnCreate();
/* Saves the custom detail to a custom field on LiveChatTranscript at the end of a chat. Assumes a custom field called Company__c was added to the Live Chat Transcript object */
liveagent.addCustomDetail('InquiryDetails', 'Suport').saveToTranscript('Inquiry_Details__c');
In the above code, we are trying o find the contact and if not available the create a new contact also searches for records that contain customer data specified by the addCustomDetail Deployment API method. findOrCreate.saveToTranscript method to save the record you find or create the chat transcript associated
with the chat. Use the findOrCreate.showOnCreate method to automatically open the record you create in a subtab in the Salesforce console. findOrCreate.linkToEntity method to link the record you found or created to another record type. The below image shows the search results on the console chat
liveagent.addCustomDetail(‘Case Subject’,’Refund policy for products’).doKnowledgeSearch() method search for Knowledge articles as shown below when customer is chat with agent.
In this post, I am going to explain how to set Pre-Chat form to collect information from visitors and customers the pre-chat page as well.Pre-chat information can help direct chat requests more efficiently and reduce the time agents spend collecting the information themselves to resolve the cases.
Understand Pre Chat API
Use the Pre-Chat API to search for or create customer records automatically when a customer completes a pre-chat form. Here is the list of methods that you can use in pre-chat API
findOrCreate.map Searches for or creates records that contain the customer data that’s specified in the pre-chat form that the customer completes. You can call the findOrCreate.map method as many times as necessary to find the appropriate records. You can list multiple fields and their corresponding details to map the detail values to the appropriate fields within the record as shown below .Here findOrCreate.map is maps the contact first name and last name with pre-chat form first name and last name.
Use the findOrCreate.map.doFind method to specify which fields to search against existing customer records when a customer completes a pre-chat form.Here is the code that searches the contact based on the pre-chat form email.
Use the findOrCreate.map.doCreate method to specify which fields in findOrCreate.map method to use to create a new record if an existing record isn’t found. Specifies which fields in your findOrCreate.map method to use to create a new record if an existing record isn’t found. You can specify one or more fields for creating new records.
Use the findOrCreate.saveToTranscript method to find or create a record and save it to the chat transcript associated with the chatSaves the record that you found or created using the findOrCreate.map.doCreate or findOrCreate.map.doFind
Pre-Chat API methods to the chat transcript associated with the chat when the chat ends.
Use the findOrCreate.showOnCreate method to find or create a record and automatically open it in a subtab in the Salesforce console.Opens the record you created using the findOrCreate.map.doCreate and findOrCreate.map.doFind Pre-Chat API methods automatically in a subtab in the to the Salesforce console.
Links the record you’ve found or created using the findOrCreate.map.doFind and findOrCreate.map.doCreate methods to another record of a different record type that you created using a separate findOrCreate.map API call. For example,
you can link a case record you found within your organization to a contact record you create. The findOrCreate.linkToEntity method can’t be used to populate fields on records that you create by using the findOrCreate API call. Instead, use the findOrCreate.map method to update field values on records.
Update the live agent chat buttons with the visualforce page that you created above as shown below.
Now if you launch the chat from the site you can able to pre-chat form that will pop up before starting the chat.
Here is result agent can see before accepting the chat.
Based on your the above pre-chat form configuration once the agent is accepting the chat salesforce is going to do the bunch of operations like searching the contacts and opening a new record creating the page and suggest the knowledge article and save it to chat transactions and etc.
Live agent post chat page allows you to share the details with customers at the end of a chat session. For example, you can direct your customers to another
Web page after they complete a chat with an agent, or forward them to a survey about their chat experience. You can create a Visualforce page to host your post-chat page, or you can develop a page on your own and add the URL to your chat
button configuration.
<apex:page showHeader='false'>
<div id='details'>
<!-- This will present all the post chat parameters available to this page -->
<h1>Post Chat Page</h1>
<p>
<!-- These variables are passed to the post-chat page and can be used to
customize your post-chat experience -->
Request Time: <apex:outputText id='c_rt'
value='{!$CurrentPage.parameters.requestTime}' /><br/>
Start Time: <apex:outputText id='c_st'
value='{!$CurrentPage.parameters.startTime}' /><br/>
Deployment Id: <apex:outputText
value='{!$CurrentPage.parameters.deploymentId}' /><br/>
Button Id: <apex:outputText value='{!$CurrentPage.parameters.buttonId}'
/><br/>
Chat Key: <apex:outputText value='{!$CurrentPage.parameters.chatKey}'
/><br />
Last Visited Page: <apex:outputText
value='{!$CurrentPage.parameters.lastVisitedPage}' /><br/>
Original Referrer: <apex:outputText
value='{!$CurrentPage.parameters.originalReferrer}' /><br/>
<!-- When the GeoLocation is not available this will appear as Unknown
-->
Latitude: <apex:outputText value='{!$CurrentPage.parameters.latitude}'
/><br/>
Longitude: <apex:outputText value='{!$CurrentPage.parameters.longitude}'
/><br/>
City: <apex:outputText value='{!$CurrentPage.parameters.city}' /><br/>
Region: <apex:outputText value='{!$CurrentPage.parameters.region}' /><br/>
Country: <apex:outputText value='{!$CurrentPage.parameters.country}'
/><br/>
<!-- End of GeoLocation information -->
Organization: <apex:outputText
value='{!$CurrentPage.parameters.organization}' /><br/>
Disconnected By: <apex:outputText
value='{!$CurrentPage.parameters.disconnectedBy}' /><br/>
Window Language: <apex:outputText
value='{!$CurrentPage.parameters.windowLanguage}' /><br/>
Chat Details: <apex:outputText
value='{!$CurrentPage.parameters.chatDetails}' /><br />
Transcript: <apex:outputText value='{!$CurrentPage.parameters.transcript}'
/><br/>
Attached Records : <apex:outputText
value='{!$CurrentPage.parameters.attachedRecords}' /><br />
Error: <apex:outputText value='{!$CurrentPage.parameters.error}' /><br
/>
</p>
</div>
<hr/>
<!-- Message to show if chat is abandoned -->
<div id='abandoned' style='display: none;'>
We are sorry you decided to leave the chat. Feel free to initiate a new session.
</div>
<!-- Code to decide if we show the abandoned block or the full data -->
<script type='text/javascript'>
var requestTime = '{!$CurrentPage.parameters.requestTime}';
var startTime = '{!$CurrentPage.parameters.startTime}';
// when startTime doesn't have a value, it means the chat never started
if (!startTime) {
document.getElementById('details').style.display = 'none';
document.getElementById('abandoned').style.display = 'block';
}
</script>
</apex:page>
Now go and update the chat button and automated invitations”post chat page ” as shown below with the visual force page your created.
Once chat is ended which will display the result as shown below.insted of showing the simple chat details even you can build your own logic like sending automatic post chat surveys or feedback etc by using post chat pages.