Difference between revisions of "ATC/Current/SDK/autotrackInViewport"

From Genesys Documentation
Jump to: navigation, search
m (Text replacement - "\|Platforms?=([^\|]*)PureEngage([\|]*)" to "|Platform=$1GenesysEngage-onpremises$2")
m (Text replacement - "\|Platforms?=([^\|]*)PureCloud([\|]*)" to "|Platform=$1GenesysCloud$2")
Line 6: Line 6:
 
|Dimension=Modules
 
|Dimension=Modules
 
|ComingSoon=No
 
|ComingSoon=No
|Platform=GenesysEngage-onpremises, PureConnect, PureCloud
+
|Platform=GenesysEngage-onpremises, PureConnect, GenesysCloud
 
|Prereq=
 
|Prereq=
 
|Section={{Section
 
|Section={{Section

Revision as of 12:00, July 15, 2020

This topic is part of the manual Journey JavaScript SDK for version Current of Genesys Predictive Engagement.

Learn how to configure which element Genesys Predictive Engagement tracks on your websites as they appear and disappear from the viewport, so you have more accurate page tracking information for use in segments and outcomes.

Description

The autotrackInViewport module tracks when an element becomes visible in the viewport or disappears from the viewport. To use autotrackInViewport, use the following options to configure the elements that you want to track:

Signature


ac('load', 'autotrackInViewport', config, [callback]);

Example

ac('load', 'autotrackInViewport', {
  inViewportEvents: [
    { selector: 'button.bg-green', eventName: 'green_button_element' },
    { selector: 'footer *', eventName: 'footer_element' }
  ]
}, function () {
    console.log('"autotrackInViewport" has been loaded');
});

Config (required)

Description: identifies an array of elements that should be tracked.

Type: object

Properties:

Name Description Type Status
selector A string that selects elements. For more information, see https://developer.mozilla.org/en-US/docs/Web/API/Element/matches String required
eventName is a string that will be used as the event name when an element matching the selector moves into or outside the viewport. String required

Example

{
  inViewportEvents: [
    { selector: 'button.bg-green', eventName: 'green_button_element' },
    { selector: 'footer', eventName: 'footer_element' }
  ]
}

Callback

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

Comments or questions about this documentation? Contact us for support!