autotrackURLChange

From Genesys Documentation
Jump to: navigation, search
This topic is part of the manual Journey JavaScript SDK for version Current of Genesys Predictive Engagement.

Learn how to customize tracking for Single Page Application (SPA) websites. Alternatively, use your preferred tag manager to customize and deploy the SPA tracking snippet. For more information, see About event tracking with tag managers. If you are just getting started, read Tracking snippet.

Description

The autotrackURLChange module tracks activity on an SPA webpage when a user clicks through relative links or when software-driven activity changes the URL or browser history.
Important
The autotrackURLChange module is automatically loaded when you load the SPA snippet.
To customize how autotrackURLChange tracks user activity, use these options:

isUrlChange

Description: checks whether the URL has changed since the last check.

Type: function

Status: default implementation available; can be overwritten

Returns: Boolean

Arguments:

Name Description Type Status
oldUrl the previous URL before the change string required
newUrl the possibly changed URL string required

Example

This example shows how to exclude tracking when a user clicks relative links on a webpage.

ac('load', 'autotrackUrlChange', {
  isUrlChange: function(oldUrl, newUrl) {
    if (oldUrl !== newUrl) {
      if (newUrl.includes(oldUrl)) {
        return false; 
      }
      return true;
    }
    return false;
  }
}, function() { });

onUrlChange

Description: executes when the URL changes via a relative link or SPA routing functionality.

Type: function

Status: default implementation available; tracks pageviews via ac('pageview'); can be overwritten

Returns: void

Arguments:

Name Description Type Status
newURL the URL the user has changed to string required
Important
By default, the tracking snippet tracks page views via ac('pageview'). If you override the default behavior using onUriChange, remember to manually include this call in the new function.

callback

When a module fully loads, callback is executed. No arguments are passed to the callback.

Example

Your SPA page may use routers or relative links to change the page URL without changing the page title. In this case, the default ac('pageview') call tracks all page views as occurring on the same page. Visit journey information that appears in Live Now and the agent UI does not reflect actual user behavior. To change this, customize the onUrlChange option as shown in the following example.

ac('load', 'autotrackUrlChange', {
  onUrlChange: function(newUrl) {
    let customTitle = document.title;
    if (newUrl.includes('marketing')) {
      customTitle = customTitle + 'marketing';
    }
    if (newUrl.includes('contact-us')) {
      customTitle = customTitle + 'contact-us';
    }
    // supply pageOverrides with location and custom title field
    ac('pageview', {
      location: window.location.href,
      title: customTitle
    });
  }
}, function() { });

delay

Use this option to set a delay between the time when the SDK realizes there is a URL change and when it sends the onUrlChange function.

Example

This example sets a 1-second delay. This gives the application time to change the page title to match the current URL.

ac('load', 'autotrackUrlChange', { delay: 1000 });