Messenger API Tutorial

This tutorial refers to Userlike’s live chat product. For Userlike’s Unified Messaging (beta) tutorials, click here.

Start Chat

If you want to start a chat session programmatically by your own code, send an event to the client.

userlike.userlikeStartChat();

Stop Chat

To quit the current session and disconnect, send quit event by calling

userlike.userlikeQuitChat();

Direct Chat With Operator

You can start a chat session with a certain Operator. If the Operator is offline, the Webvisitor will be presented with the Offline Message form, there is no fallback to other Operators in that Group.

userlike.userlikeRequestOperatorChat(operator_id);

Chat Ready

If you need to initialize DOM elements based on the Userlike client status, you can hook in the callback which is fired after the Userlike client is loaded.

  1. userlike.userlikeReady = function() {
  2. setupMyButton();
  3. };

Chat State

You can query the current state of the Chat Widget.

userlikeChatState();
Return values
IdleThe default chat state before a chat session has been started.
ChatIndicates that a live chat session is active.
ChatMinimizedIndicates that the chat window is minimized.
OfflineIndicates that the chat session has been disconnected.

Button Handler

If you need to update DOM elements or parts of your business logic regarding the online or offline status of the chat button, you can hook in this callback. It is fired after the Userlike client checked if it should display the chat button based on your Widget configuration.

  1. userlike.userlikeButtonHandler = function(visible) {
  2. updateStuff();
  3. };

Button Visibility

You might need to temporarily hide the chat button when it blocks the view of your application. The functions to do so work on a visual but not on a logical level. Which means that with these calls you can't make the chat button appear if it’s hidden due to your offline status. However, if you have e.g. a search function that would benefit from a hidden chat button, you can bind the focus and blur events of the field to hide or show the chat button when necessary.

userlike.userlikeHideButton();
userlike.userlikeShowButton();

Disable Segment Integration

The Chat Widget automatically detects your Segment instance and sends Webvisitor information to it. If you want to disable this feature, simply set "userlike.segment_analytics_enabled" to false before the Userlike snippet is loaded.

userlike.segment_analytics_enabled = false;