UI Capture

Get started downloading and installing UI Capture

Overview

Skill Level: Intermediate

Prerequisites

Review the Tealeaf UI Capture overview for system prerequisites, supported browsers, and guidelines and tips before installing.

Step-by-Step

1. Download UI Capture

You can download the UIC package by following the SDK download instructions at Download the UIC, iOS, and Android SDKs.

2. Install the UI Capture JavaScript on your web server

The UI Capture library should be installed in a directory on the web server which contains site JavaScript. For best performance, the JavaScript should be served with caching and compression encoding (gzip) enabled. Consult your web server documentation for enabling these settings.

Do not bundle UI Capture with unrelated scripts. Doing so creates an unnecessary dependency between otherwise completely independent scripts. The UI Capture SDK can be bundled with 3rd party scripts that it has dependencies on, such as pako, hammer, and jQuery.

Use the non-minified, human readable copy of UI Capture to ease the integration and debugging in the development environment. The non-minified JavaScript makes it easier to debug and add console logging functionality. It is not recommended to use the non-minified build in a production setting or during performance testing.

Verify the JavaScript is accessible by navigating to the URL in the browser.

3. Include the UI Capture JavaScript in your web application

Use the URL of the UI Capture JavaScript and include it in the HTML using the script tag. It is strongly recommended to set the async attribute for the best performance.

The UI Capture JavaScript can be included anywhere in the HTML and at any time during the page lifecycle, including after page load. However, it is important to verify correct operation with a simple static include before switching to any dynamic loading mechanisms.

Using script loaders or Tag Managers may cause the UIC to not be initialized in a timely manner on the page resulting in missed interactions or incomplete session replay. In a worst case scenario, issues with the loader may prevent the UIC from being loaded at all causing a complete loss of session data.

To capture all user interaction with the page and provide reliable analytics, the script must be statically included at the top of the HTML page in the <head> section as follows:

<!-- NOTE: Replace /scripts/tealeaf.js with the path and name specific to your installation. -->
<script async src="/scripts/tealeaf.js"></script>

Verify the JavaScript is loaded by checking for the presence of the window.TLT object on the page.

Expected outcome

You installed the UI Capture library. Next, configure UI Capture for your website!

Updated about a month ago


UI Capture


Get started downloading and installing UI Capture

Suggested Edits are limited on API Reference Pages

You can only suggest edits to Markdown body content, but not to the API spec.