A Developers Blog

This blog has moved to GitHub, and you should be redirected shortly...

Saturday, October 29, 2016

How To Connect To The Engagement History API Through Postman

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.

1) The first thing you need to do is find out what the base URI is for your account. This will be needed to make any API calls. In Postman, make a new GET request with the following URL: https://api.liveperson.net/api/account/{Your Account Number}/service/engHistDomain/baseURI.json?version=1.0

You will need to update the '{Your Account Number}' with just your account number. For example, your updated link should look similar to this: https://api.liveperson.net/api/account/56072331/service/engHistDomain/baseURI.json?version=1.0

2) Now, click on the Send button and you should get a 200 response with your base URI.



3) In a new tab in Postman, update the request to be a POST request, and add the following URL to the request: https://{YOUR BASE URI}/interaction_history/api/account/{YOUR ACCOUNT NUMBER}/interactions/search?offset=0&limit=10

You will need to update the '{YOUR BASE URI}' and the 'YOUR ACCOUNT NUMBER}' parts of the URL with your LiveEngage account number, and with the base URI that you received in the steps before. For example, your updated link should look similar to this: https://va-a.enghist.liveperson.net/interaction_history/api/account/56072331/interactions/search?offset=0&limit=10


4) For the API call to be successful, you will need to add the following to the request: a body, a content type header, and an OAuth 1 header. To add the Body, click on Body, and choose "raw" as the type. Add the following parameters to the body: {"start":{"from":1477052344000,"to":1477657144000}}


The data that you just added is the timeframe that you would like to query the API for. The time is entered as an epoch timestamp in milliseconds. To quickly get the date that you would like to use in an epoch timestamp format, you can use this website here: http://www.epochconverter.com/. Note: You may need to update the timeframe for the query to work with your account.

5) Next, lets add the Content-Type header to the request. Click on "Headers" tab, and in the "key" field type in: Content-Type, and in the "value" field type in: application/json.


6) Lastly, you just need to add your OAuth 1 header to the API call. Click on "Authorization" tab, and in the type drop down choose "OAuth 1.0". In the fields that appear, you will need to add your API keys from LiveEngage:
  • Consumer Key - Your App Key
  • Consumer Secret - Your Secret
  • Token - Your Access Token
  • Token Secret - You Access Token Secret
Also, on the right hand side, make sure the check for "Add params to header" is checked.


Once you fill in your keys, click on the "Update Request" button to update your request.

Now, click on the "Send" button, and you should get a 200 response back with your chat transcripts.


You can import a template for this query directly into Postman by clicking this link here: https://www.getpostman.com/collections/6bd9d4cc64bbee6843f1


Summary: This tutorial showed you how to use Postman to query the Engagement History API that is available from LivePerson.

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

Labels: , , , ,

Saturday, May 14, 2016

Querying The Engagement History API With Firefox RESTClient

The Engagement History API is an API that is available from LivePerson, and it allows for you to search, filter, and keep copies of chat transcripts and the related data, such as visitor information, agent information, and much more.

Before writing any code to start querying the API, it can be useful to use a tool that will allow for you to connect to the API in seconds.



This article discusses how you can use the RESTClient query to the Engagement History API. To read the article, click here: https://connect.liveperson.com/content/querying-engagement-history-api-firefox-restclient

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

Labels: , , ,

Friday, March 25, 2016

Troubleshooting APIs With A RESTClient

When it comes time to connect to APIs, I find that it is a lot easier to test them using a REST client before you start writing any code. Using a REST client allows for you to make sure that you are able to connect to it successfully, and it allows for you to try out different parameters of the API.

One of the best tools that I was introduced to is, the Firefox RESTClient Plugin. This plugin is very easy to use, and it allows for you to save your request for quick reference.



This article discusses how you can use the RESTClient connect to an API and it goes through the different settings. To read the article, click here: https://connect.liveperson.com/content/troubleshooting-apis

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

Labels: , , ,

Wednesday, February 10, 2016

LiveEngage - Engagement History API Program To Send Email

Today I wanted to share with you a program I made that will allow you to use the Engagement History API to send out emails for transcripts that have a particular keyword.

The program will use the API to pull all of your chat transcripts for the previous day that contain a certain keyword, and then it will send it to an email address that you specify. The program makes use of the SendGrid API in order to send the emails.

One example use case for this tool is if you wanted to get an email every time someone answered dissatisfied on your post chat survey, you could use that keyword and it will automatically pull those transcripts.

In order to use the program, you will need to have a SendGrid account with an API key enabled on it. SendGrid allows for you to send up to 12,000 emails for free a month, and if you need to send more they offer very cheap plans. You will also need to have the Engagement History API enabled on your LiveEngage account in order to use the program.

If you are interested in checking out the program or getting the source code, you can find it on GitHub here: https://github.com/scottwestover/LiveEngageExamples/tree/master/APIs/Java-EHAPIProgram

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

Labels: , , ,

Wednesday, January 13, 2016

LiveEngage - Use Your Own Custom Chat Button By Using JQuery

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.

If you have created both buttons, then we can get started.

1. The first thing you will want to do is add the div for your LiveEngage chat button to your site to make sure it works.

2. Now, we are going to wrap this div inside an anchor tag with a class, which is what we are going to use to trigger the click on the chat button. For example, if your LiveEngage div is: <div id="slideout1"></div>, your code will look like this now:

<a class="live-person-ghost"><div id="slideout1"></div></a>

3. Next, we are going to add an id to our custom button. By adding an id, it will allow use to check to see if that button was clicked. Here is an example:

<button type="button" id="live-engage-link">Instant Live Chat</button>

4. If you do not have JQuery on your website, you will need to add the following script to the head section of your site:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>

4. Now, we are going to add the JavaScript that will allow us to trigger the click on the LiveEngage button when someone clicks on your custom chat button. Add the following code before your closing body tag:

5. Now that you have added the JavaScript, we can test the code to make sure it works. If you click on your custom chat button, and it triggers the LiveEngage chat button, then the last thing we need to do is hide the LiveEngage chat button. You will need to add the following style to your LiveEngage div: style="display:none".

Here is a complete example of the code:

Summary: This tutorial showed you how to use JavaScript and CSS to use your own custom chat buttons with LiveEngage.

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

Labels: , ,

Sunday, January 3, 2016

LiveEngage - Connecting To The Engagement History API In Python Example

Hi Everyone. In a previous post, I showed you how to connect to the Engagement History API by using Java.  In case you missed the previous post, the Engagement History API is a REST API that is available from LivePerson. This API allows you to access your transcript data without having to go in and manually export them.

Here is a link to the previous post in case you missed it: Java Engagement History API Tutorial

Today, I wanted to share with you some sample code that will allow you to connect to the API in Python. Basically, the code uses the requests and requests_oauthlib libraries to connect to the API, and then it prints the response to the console.

Here is the code sample:

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

Labels: , , , ,

Wednesday, December 16, 2015

LiveEngage - Connecting To The Engagement History API In Java Tutorial

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/

For this tutorial, I am using Eclipse Mars 4.5.0, Scribe 1.3.7, and Maven. However, you should be able to follow along if you are using a different IDE.

In Eclipse, you will need to create a new Maven Project. Once you have done this, open the pom.xml file for your project, and add the following dependency:

<dependency>
<groupId>org.scribe</groupId>
<artifactId>scribe</artifactId>
<version>1.3.7</version>
</dependency>

In order to use Scribe to make an OAuth call, we will need to define a new provider class that will be used by the OAuthService object. If you are not familar with Scribe, you can read more about it here: https://github.com/scribejava/scribejava

Now, in your src/main/java folder, you will want to create a new class called EHAPI.java. This class is going to extend the DefaultApi10a class. Once the class is created, you will need to add the following code to it:

Now that we have our provider, we will need to create a new class that is going to call the API and display the results to the console.

So, in your src/main/java folder, you will need to create a new class called EngagementHistory.java. Once the class is created, you will need to add the following code to it:

Basically, we are using Scribe to create our OAuth service, and once we do this we our using our credentials for the API to create and sign our OAuth request. Once this is done, we send the request and print it to the console. Please see the comments in the code for what each line is doing.

You can download the complete code on GitHub from here: https://github.com/scottwestover/LPEngagementHistoryAPIExamples

Summary: This tutorial showed you how to connect to the Engagement History API in Java by using Scribe. You can build upon this tutorial by adding the option to allow the user to input a date range, convert the response into a transcript file that is in a readable format, or even send the responses to a database.

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

Labels: , , , , ,

Tuesday, December 1, 2015

LiveEngage Best Practice - Multitasking With Hot Keys

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?”

Hot keys are shortcuts that are available to you in LiveEngage that you can use to easily move between tasks such taking a chat, changing your status, or even viewing the visitor list.

What Are The Hot Keys?

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.

Labels: ,

Wednesday, November 25, 2015

LiveEngage - Using CSS To Modify Embedded Chat Buttons

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.

In the first example, we are going to use CSS to change the font-family of the embedded chat button, and in the second example we are going to use CSS to add a hoover effect to the embedded chat button. 

Let's get started:

Example 1: Change the default font-family

Code:


Result:


Before
After
2015-07-14_0935.png
2015-07-14_0935_001.png
Example 2: Add Hover Effect

Code:


Result:


Before
After
2015-07-14_1016.png
Untitled.png
Summary: This tutorial showed you how to use custom CSS to modify the default styling of your embedded chat buttons.

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

Labels: , , ,

Thursday, November 19, 2015

LiveEngage - Use The Web App SDK To Send Chat Lines To The Agent Console

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.

Let's get started:

1. The first thing we will want to do is create a basic HTML template for our web application. Create an index.html file in your favorite editor and add the following code:

2. The next thing we need to do is reference the SDK code in your web application. To do this, you need to add the following code to the head element of your HTML page:

3. Next, you need to add the following JavaScript right before your closing body element of your HTML page:

For the code we just added, we declared a variable that is set to the SDK, and then we initialized it, which allows to communicate with the agent console. By doing this, we are able to send data to the chat input line of the agent console, and we are able to pull information about the chat from the agent console.

Lastly we defined a variable that contains the data we want to send to the chat input line, and then we sent the data.

4. Your final index.html page should look like this:


5. Now that we have our web application ready to go, you just need to host it on a secure site. Once this is done, we need to add the widget inside LiveEngage. You can read more about that here: Add Widget To LiveEngage

Summary: This tutorial showed you how to use the Web Application SDK to send a chat line to the agent console. and how to add the your web application as a widget inside the agent console.

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

Labels: , , ,

Friday, November 13, 2015

LiveEngage - Chat Transcript XML Parsing Tool

Today I wanted to share with you a XML Chat Transcript Parsing tool that I created to parse the chat transcripts that you can export from LiveEngage.

Inside LiveEngage, there is no easy way to see/analyze the chat transcripts without going through them one at a time. One of the options that is available to you, is you are able to export the transcripts as a text file or as xml file.

With the tool, you are able to load in these transcripts, and it will parse the information into a data table, which then you can filter to find the information you are looking for. For example, if you only want to look at chats with low CSAT scores, or if you are looking for chats where an agent answered yes to an Agent Survey question, or even if you are looking for a particular visitor's chat, you can filter the table to only contain this information.

The tool allows you to print out individual chats, export the data to a csv file, or even copy the content of the table.


Besides allowing you to search the transcripts, the tool also offers some reporting that is currently not available in LiveEngage. Here is a list of some of the reports that are currently available:
  • Average Agent Response Time
  • Average Visitor Response Time
  • Average Agent Response Time Per Agent
  • CSAT Reporting 
  • CSAT Reporting By Agent
  • Revenue Reporting (Based On Agent Survey Question)
  • A Map Of Where Your Chats Are Coming From
  • Custom Reports (Choose the questions from your surveys you would like to report on)
If you are interested in checking out the tool, you can find a live version here: http://scottwestover.github.io/

If you are interested in getting a local copy, or forking a copy of the project, you can find the tool on GitHub here: https://github.com/scottwestover/LiveEngage-Chat-Transcript-Tool

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

Labels: , ,

Wednesday, November 4, 2015

LiveEngage - Use URL To Pre-fill Your Account ID On The Login Page

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.


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

Labels: , ,

Friday, October 23, 2015

LiveEngage - Remove Cancel & Submit Buttons From Offline Survey

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.

Let's get started (if you already know how to edit your offline survey, go to step 4):

1. In LiveEngage, go to your campaigns tab and choose the window that you would like to edit the offline survey for.

2. Now, on the views drop down, choose offline survey.

3. Next, click on the '+' icon to add elements to your survey. In the pop up window that opens, click the check box next to 'Heading'.


4. Then on survey, click the text "Click to edit survey heading" to add CSS code to your survey. Add the following code to your survey:

5. Now, save your changes, and head over to your test site to see the changes. On your offline survey you should see your message appear and there should be not buttons on your survey.



Summary: This tutorial showed you how to remove the Cancel & Submit buttons from the Offline Surevey.

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

Labels: , ,

Monday, October 19, 2015

LiveEngage - Custom Offline Message With Link To Your Leave A Message Form

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.

Let's get started:

1. In LiveEngage, go to your campaigns tab and choose the window that you would like to edit the offline survey for.

2. Now, on the views drop down, choose offline survey.

3. Next, click on the '+' icon to add elements to your survey. In the pop up window that opens, click the check box next to 'Heading'.


4. Then on survey, click the text "Click to edit survey heading" to add text to your header. You can add custom HTML and CSS inside the header in order to style it how you want. For example:

5. Now, save your changes, and head over to your test site to see the changes. On your offline survey you should see your message appear.


Note: At this time, the header will only appear on the offline survey if you have a question on your survey. To show the header with no questions, you will need to use CSS to hide the quesitons.

Summary: This tutorial showed you how to create your own offline message on your offline survey in LiveEngage, and it showed you how you can include links on the offline survey. In our next tutorial, I will show you how we can remove the cancel and submit buttons from the offline survey.

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

Labels: , ,