Tutorial

I have gotten a lot of request from people on how to connect to the APIs that are available from LivePerson using Postman, so I decided to share how to do this here.

In order to follow along with this tutorial, you will need the API keys that are available for Engagement History API, and you will need access to the Postman App. To get these keys, you can log into the LiveEngage console, and grab them from them from the API tab under data sources, which is on the campaigns tab. If you are not sure on how to setup your keys, you can learn how to do so here.

If you do not already have Postman installed, you can learn more about it and install it from here:  https://www.getpostman.com/

If you would just like to import a template of the query into Postman, you can do so here:  https://www.getpostman.com/collections/6bd9d4cc64bbee6843f1

Let’s get started.

Update: With the new HTML engagements in LiveEngage, this method is now outdated. It is recommended that you use the supported method listed above.

The purpose of this tutorial is to show you how you can use your own chat buttons with LiveEngage by using JavaScript.

Currently in LiveEngage, you have a limited number of options for creating a chat button in the LiveEngage studio. This can make it hard for the chat button to match the look of your site, especially with all of the things you can do with CSS and JavaScript today.

So, in order to work around this,you will need to create your own chat that you would like to use on your website, and you will need to create a basic embedded chat button in the LiveEngage studio. Don’t worry about what the embedded chat button looks like because we are going to use CSS styling to hide the chat button, and then use JavaScript to click the LiveEngage chat button when your button is clicked.

The purpose of this tutorial is to show you how to connect to the Engagement History API in Java.

The Engagement History API is a REST API that is offered through LivePerson that allows you to pull your chat transcripts without having to manually go through and export them. In order to connect to the API, you will need to get a set of API keys from LivePerson and install them on your account. Once you have done this, you will need to send an OAuth 1 request to the server in order to access your transcripts.

If you are not familiar with OAuth 1, you can read more about it here:  http://oauth.net/core/1.0/

One of the main things that I usually hear from agents is that they are always multitasking and that they are looking for ways to be more efficient when they are chatting, so they can provide the best experience possible to the customers that they are chatting with. My response to the client is, “Are you utilizing the hot keys that are available in LiveEngage?”

When you are in the LiveEngage workspace, there are seven hot keys that you can use to save you time. You can view a complete list of the hot keys that are currently available to you by opening the hot keys menu. You can view this menu by holding down the ctrl and tilde keys (CTRL + ~).

You will also see the hot keys appear above the menu items that the are related to.

When the menu is displayed, you can either click on the shortcut that you want to use, or you can press the appropriate character key to perform that shortcut. Here is a list of the shortcuts that you can use:

• (L) Logout - Allows you to logout of the agent workspace. 
• (V) Visitor List - Will take you to the visitor list. 
• (S) Status - Will toggle your status between online, busy, and offline. 
• (A) Accept Engagement - Allows you to accept incoming chats. 
• (X) End Engagement - Allows you to end the current engagement. 
• (T) Transfer Engagement - Allows you to transfer the current engagement to another agent. 
• (N) Next Engagement - Allows you to respond to the next engagement. 
• (I) Inactive List - Allows you to view your resolved engagements. 

The end engagement and transfer engagement hot keys are only available during chat. By learning these shortcuts it will allow you to be more efficient and allow you to spend more time focusing on your customers.

This best practice, based on feedback from LiveEngage users, is meant to offer you guidance and to help drive value for your brand.

I hope you enjoyed this tutorial. If you have any questions or comments, please feel free to post them below.

Update: With the new HTML engagements in LiveEngage, this method is now outdated. It is recommended that you use the supported method listed above.
The purpose of this tutorial is to show you how to use your own custom CSS to modify your embedded chat buttons from LiveEngage.

Currently in LiveEngage, the only options you have for an embedded button is to use an image or the few text styling elements that are available in the engagement studio. There is no way to use your own fonts, CSS, or HTML elements for your chat button, which can sometimes make it hard for your chat button to match the rest of the theme of your site.

For example, if the rest of the links on your site have hover effects, or if the font family of the text in the links is ‘Comic Sans MS’, your embedded chat button will not match the feel of your site. In order to fix this, you can use custom CSS on your site to modify the default styling of the button.

The embedded chat buttons have a class called ‘LPMlabel’, so by adding a CSS styling to the page with the !important attribute, it will override the default CSS.

The purpose of this tutorial is to show you how to use the Web Application SDK to send chat lines from your own web application.

The Web Application SDK is a client-side package that can be used to communicate with the LivePerson Agent Workspace. In order to use the SDK, your web application needs to be able to open inside an iFrame, and your application must be hosted over SSL. You can read more about the SDK here: Web App SDK PDF

For this tutorial, we are going to use create a simple web page that will send a “Hello World!” chat line to the agent console.

On the LiveEngage login page, there is a ‘remember me’ check box that you can check to have your information stored in a cookie, however this is not always a valid option for everyone. For example, if your computer automatically clears your cookies and cache every night, or if you have cookies disabled, then the ‘remember me’ check box will not remember your information, which then requires you to enter your account number, username, and password every time you want to login.

You can get around this by adding some additional parameters to the URL, which will then automatically fill out the fields on form when you request the login page.

Here is an example:

https://authentication.liveperson.net/login.html ?stId=123456

By adding the stId variable as a parameter on this URL, and by assigned it a value, it will populate the account number field on the login page. You just need to replace the 123456 with your Account ID for this to work.

Update: This method is now outdated. Now, in LiveEngage, when you create a new survey with no questions, it will automatically remove the Submit button from the survey.
The purpose of this tutorial is to show you how to remove the Cancel & Submit buttons from your offline survey in LiveEngage.

The default offline survey in LiveEngage is nice, but sometimes you want added functionality that is not there, or sometimes you want to display your own custom offline message, but you do not want the customers to leave an offline message using the LiveEngage chat.

We can prevent the user from leaving a message by removing the Submit button from the offline survey. To do this, we will need to add some code to the header on the survey. The header allows for you to add your own custom CSS, which is how we will hide those buttons. You can make changes to your main offline survey, but it is recommended that you test the changes first before you push changes to your live site.

Note: In LiveEngage, if you have an offline survey with no questions on it, then the header will not generate on your survey. To have an offline survey with just your custom message and no buttons, you will need to add a question to your survey, and we can use CSS to hide that question.

Update 6/10/16: This work around is no longer needed for LiveEngage. Instead, if you just include your message in the header of the survey, and delete all questions of the offline survey. The header will show correctly with a close button for the offline survey.

The purpose of this tutorial is to show you how to add your own custom offline message on the offline survey in LiveEngage, and have a link to your own leave a message form.

The default offline survey in LiveEngage is nice, but sometimes you want added functionality that is not there, or sometimes you want to have a customer leave a message for you using another method that you already have, but you don’t want to disable your chat buttons since there is no way to turn off the offline survey.

We can do this by using the header that is available on the offline survey in LiveEngage. The header allows for you to add your own custom HTML, which is how we will add the link to your own form. You can make changes to your main offline survey, but it is recommended that you test the changes first before you push changes to your live site.

The purpose of this tutorial is to show you how to make a simple Chrome Extension. Throughout this tutorial we will be making a simple extension that when clicked, will show an HTML page with the text “Hello World!”.

A Chrome Extension is just some basic HTML, CSS, and JavaScript that allows you to add some type of functionality to Chrome by using Chrome’s JavaScript APIs. For this tutorial, we are going to focus on building a simple Hello World html page that uses basic JavaScript.