How to personalize chat button in Live Chat

Live Chat lets you communicate with your customers in a fast and efficient way. Thanks to that you are at your customer’s disposal all the time and you can react to all queries and problems.

Personalization of the button lets you customize the button by changing it for your company’s logo for example and changing its position on the website from the two default ones. It unfolds when clicked, and the user can start a conversation with a consultant or leave a message when the consultant is offline.



Main steps

  1. Go to the Live Chat settings.
  2. Hide the button.
  3. JavaScript code.

The first necessary step that you need to take is hiding the default chat button in the system. You can do it the settings of your existing chat or in the first step while creating the chat.

In the live chat settings, you can find Hide button checkbox at the bottom. After you tick the checkbox, the button which unfolds the chat window on the right-hand side of the screen will disappear.

Live Chat API:

window.smLiveChat = {
    enabled: false, 
    toggleChat: function()
enabled: false, – shows information whether chat has been displayed
toggleChat: function() – display/hide the chat
window.smLiveChat.toggleChat = function () {
    return toggleResult;
The possible values for toggleResult:
  • The chat failed to display, waiting for response from server
toggleResult = {
    success: false,
    opened: false,
    code: 1,
    reason: "Waiting for response from server"
  • The chat displayed correctly
toggleResult = {
    success: true,
    opened: boolean
  • The chat failed to display, it is not available for the current location
toggleResult = {
    success: false,
    opened: false,
    code: 2,
    reason: "No chat available for current location"

When the chat displays on the website, the following function will be triggered:

window.smLiveChatAfterInitCallback: function()
 - wywoływana w momencie gdy czat pojawi się na stronie