About the Chat Widget JavaScript API

About the API

The Chat Widget JavaScript API lets you interact with the chat widget embedded on your site. It might come in handy whenever you want to gather some additional data using Text, show or hide your chat widget on certain occasions, or amend its behavior in a way that is not provided by the standard settings. This document focuses on Developers and requires a basic knowledge of JavaScript. However, if you would have any questions, don’t hesitate to start a chat with our Support Team or add a new topic on our Discord for Developers.

Getting started

The API is accessed through the LiveChatWidget object. It’s being initialized within the widget code, which is used to install our chat widget on your site. If you haven’t installed the code yet, you can either find it directly in the app or copy it from below. Remember to replace <ORGANIZATION_ID> with your organization ID.

Text widget code

<!-- Start of Text (www.text.com) code -->
<script>
  window.__lc = window.__lc || {};
  window.__lc.organizationId = "<ORGANIZATION_ID>";
  window.__lc.integration_name = "manual_onboarding";
  window.__lc.product_name = "text";
  (function (n, t, c) {
    function i(n) {
      return e._h ? e._h.apply(null, n) : e._q.push(n);
    }
    var e = {
      _q: [],
      _h: null,
      _v: "2.0",
      on: function () {
        i(["on", c.call(arguments)]);
      },
      once: function () {
        i(["once", c.call(arguments)]);
      },
      off: function () {
        i(["off", c.call(arguments)]);
      },
      get: function () {
        if (!e._h)
          throw new Error(
            "[LiveChatWidget] You can't use getters before load.",
          );
        return i(["get", c.call(arguments)]);
      },
      call: function () {
        i(["call", c.call(arguments)]);
      },
      init: function () {
        var n = t.createElement("script");
        ((n.async = !0),
          (n.type = "text/javascript"),
          (n.src = "https://cdn.livechatinc.com/tracking.js"),
          t.head.appendChild(n));
      },
    };
    (!n.__lc.asyncInit && e.init(), (n.LiveChatWidget = n.LiveChatWidget || e));
  })(window, document, [].slice);
</script>
<noscript
  ><a
    href="https://www.text.com/chat-with-ai-agent/<ORGANIZATION_ID>/"
    rel="nofollow"
    >Chat with AI agent</a
  >, powered by
  <a href="https://www.text.com/" rel="noopener nofollow" target="_blank"
    >Text</a
  ></noscript
>
<!-- End of Text code -->

The LiveChatWidget object comes with four functions:

on registers a callback function for a specific event
once similar to on but after single event trigger the callback is removed
off removes a callback registered by on
call allows you to invoke methods and setters
get makes it possible to fetch data

The usage of these functions is based on passing the correct arguments in the following pattern:

LiveChatWidget.function("method", "data");

For example, if you would like to set your customer’s name to John Doe, this is how it would look like:

LiveChatWidget.call("set_customer_name", "John Doe");

Asynchronous Initialization

Asynchronous initialization is an optional feature available for chat widget via JavaScript API. It allows for far more control over the moment when the chat widget should be loaded. It can be especially useful if you would like to make widget initialization happen as a consequence of some user interaction, or your own application business logic event. This feature is disabled by default, so the chat widget loads automatically just after the snippet code is executed. In order to enable it, you need to explicitly set __lc.asyncInit property to true.

<script>
  window.__lc = window.__lc || {};
  window.__lc.organizationId = "<ORGANIZATION_ID>";
  window.__lc.asyncInit = true;

  /* rest of the standard snippet code */
</script>

From now on the snippet code will be executed but the chat widget and its resources will not be loaded. It means that although you will have access to LiveChatWidget object, the widget itself will not be present on your website and the ready callback will not be triggered. Later in your code you can initialize chat widget manually when needed. To do that simply call init function from LiveChatWidget object.

LiveChatWidget.init();

​About the API

​Getting started

​Asynchronous Initialization

About the API

Getting started

Asynchronous Initialization