If your website is a single-page application (SPA, e.g. Angular, React, Ember.js), it includes functionality that the standard page-view tracking cannot catch or you wish to do more advanced tracking, Leadfeeder’s JavaScript API is useful to you.

Examples where the JavaScript API can be used:

  • Track transitions/virtual page views in single-page apps.

  • Track non-page view events, such as in-page dialogs or video/media playback.

NOTE: If you use Google Tag Manager to use Leadfeeder Tracker, remember to add <script> before the script and </script> to the end of the script.

API usage

The Leadfeeder tracker script exposes a set of methods for the web page to call if needed. All these methods exist under the window.ldfdr -object in the page.

NOTE: When using the Leadfeeder JavaScript API it is good to keep in mind that Leadfeeder Tracker supports multiple trackers on one page. The methods in the JavaScript API are designed so that, by default, the behavior is applied to all trackers. However, you can call them for specific tracker instances only. As an example, if you have two different Leadfeeder tracker scripts on the web page, calling window.ldfdr.track() will send a tracking event for both.


Sends a page view event. It supports arguments as an object.

pageUrl: "https://www.example.com",
pageTitle: "Example page"

If the arguments are not present, it will default to window.location.href for pageUrl and document.title for pageTitle.

For SPA tracking, calling window.ldfdr.pageview()without arguments after a state change is usually enough as new pageUrl and pageTitle will be automatically picked up.

Additionally, you might want to prevent double tracking by disabling automatic sending of the tracking event on each page load. This change needs to be done inside the code snippet used for loading the tracking script (check GTM or your website's code).


If you use Leadfeeder’s Google Tag Manager template, another option is that you unselect Automatic tracking as shown in the picture below:


Returns an array of all tracker instances on the page. See getTracker() below for details on how to interact with the tracker instances.


Get a tracker instance by trackerId. For the tracker instance following methods are supported:

var tracker = window.ldfdr.getTracker("abcdef");
// Sends a pageview to specific tracker, supports
//same arguments as pageview() above


You can obtain the Leadfeeder clientId with the following call:


ClientID is the visitor ID that is stored in the Leadfeeder cookie. It matches to the lf_client_id field that is returned from the Leadfeeder API's visits end-point.


Identify() is one of the methods that Leadfeeder’s JavaScript API exposes for the web page to call. Identify() allows you to use your existing ways of identifying website visitors within Leadfeeder. Please read more here.

How to know that it is safe to call window.ldfdr.getTracker() when using JS API:
You can inject following code into the script:

document.addEventListener('ldfdr.trackerReady', function(event) { // do stuff });

and if you want to use the lfClientId (visitor ID) then you can use:

document.addEventListener('ldfdr.trackerReady', function(event) { var id = event.tracker.getClientId(); // do stuff });

Leadfeeder cookie expiration

As a default Leadfeeder cookie expires in two years (730 days). If wanted, you can use the following to make the cookie to expire after a shorter time:


If you use Leadfeeder’s Google Tag Manager template, another option is that you set up the expire time in Google Tag Manager settings as shown in the picture below:

NOTE: Please note when changing the cookie expiration time, this setting is taken into consideration only if you have enabled cookies in your Leadfeeder cookie settings here. When it comes to using GTM, this requires that you are using the latest version of Leadfeeder script in your GTM - check the template in GTM for possible updates.

Sample use case: SPA tracking with Google Tag Manager

STEP 1: Add a new Custom HTML tag in your Google Tag Manager.

STEP 2: Name as appropriate.

STEP 3: Add the following code to HTML section:


STEP 4: Configure a trigger for "History change".

STEP 5: Test in Google Tag Manager’s Debug mode.

NOTE: This approach relies on your SPA firing a History change/push state change event on transitions, or changes the URL fragment. If neither of these happens, you can consider alternative triggers such as pushing an event from site JavaScript to GTM DataLayer.

Did this answer your question?