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

From Genesys Documentation
Jump to: navigation, search
m (Text replacement - "\|Platform=([^\|]*)GenesysEngage-onpremises([\|]*)" to "|Platform=$1GenesysEngage-cloud$2")
(Published)
Line 3: Line 3:
 
|DisplayName=autotrackInViewport
 
|DisplayName=autotrackInViewport
 
|TocName=autotrackInViewport
 
|TocName=autotrackInViewport
|Context=Learn how to configure which element {{MINTYDOCSPRODUCT}} 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.
+
|Context=Learn how to configure which element {{MINTYDOCSPRODUCT}} tracks on your web sites as they appear and disappear from the viewport. This configuration provides accurate page tracking information for use in segments and outcomes.
 
|Dimension=Modules
 
|Dimension=Modules
 
|ComingSoon=No
 
|ComingSoon=No
|Platform=GenesysEngage-cloud, PureConnect, GenesysCloud
+
|Platform=PureConnect, GenesysCloud, GenesysEngage-cloud
|Prereq=
 
 
|Section={{Section
 
|Section={{Section
 
|sectionHeading=Description
 
|sectionHeading=Description
 
|anchor=Description
 
|anchor=Description
 
|alignment=Vertical
 
|alignment=Vertical
|Media=
+
|structuredtext=The <code>autotrackInViewport</code> module tracks when an element becomes visible in the viewport or disappears from the viewport. To use <code>autotrackInViewport</code>, configure the elements to track using the following options:
|image=
 
|structuredtext=The <code>autotrackInViewport</code> module tracks when an element becomes visible in the viewport or disappears from the viewport. To use <code>autotrackInViewport</code>, use the following options to configure the elements that you want to track:
 
  
 
*{{Link-SomewhereInThisVersion|manual=SDK|topic=autotrackInViewport|anchor=Config|display text=Config}}
 
*{{Link-SomewhereInThisVersion|manual=SDK|topic=autotrackInViewport|anchor=Config|display text=Config}}
 
*{{Link-SomewhereInThisVersion|manual=SDK|topic=autotrackInViewport|anchor=Callback|display text=Callback}}
 
*{{Link-SomewhereInThisVersion|manual=SDK|topic=autotrackInViewport|anchor=Callback|display text=Callback}}
|structuredtextwide=
 
|FAQHeading=
 
 
|Status=No
 
|Status=No
 
}}{{Section
 
}}{{Section
Line 25: Line 20:
 
|anchor=Signature
 
|anchor=Signature
 
|alignment=Vertical
 
|alignment=Vertical
|Media=
 
|image=
 
 
|structuredtext=<br /><syntaxhighlight lang="javascript">
 
|structuredtext=<br /><syntaxhighlight lang="javascript">
 
ac('load', 'autotrackInViewport', config, [callback]);
 
ac('load', 'autotrackInViewport', config, [callback]);
 
</syntaxhighlight>
 
</syntaxhighlight>
|structuredtextwide=
 
|FAQHeading=
 
 
|Status=No
 
|Status=No
 
}}{{Section
 
}}{{Section
Line 37: Line 28:
 
|anchor=Example
 
|anchor=Example
 
|alignment=Vertical
 
|alignment=Vertical
|Media=
 
|image=
 
 
|structuredtext=<syntaxhighlight lang="javascript">
 
|structuredtext=<syntaxhighlight lang="javascript">
 
ac('load', 'autotrackInViewport', {
 
ac('load', 'autotrackInViewport', {
Line 49: Line 38:
 
});
 
});
 
</syntaxhighlight>
 
</syntaxhighlight>
|structuredtextwide=
 
|FAQHeading=
 
 
|Status=No
 
|Status=No
 
}}{{Section
 
}}{{Section
Line 56: Line 43:
 
|anchor=Config
 
|anchor=Config
 
|alignment=Vertical
 
|alignment=Vertical
|Media=
+
|structuredtext='''Description:''' identifies an array of elements that should be tracked.
|image=
 
|structuredtext=Description: identifies an array of elements that should be tracked.
 
  
Type: object
+
'''Type:''' object
  
Properties:
+
'''Properties:''' See the following table.
 
{{{!}} class="wikitable" role="grid"
 
{{{!}} class="wikitable" role="grid"
 
! class="confluenceTh tablesorter-header sortableHeader tablesorter-headerUnSorted" data-column="0" scope="col" role="columnheader" aria-label="Name: No sort applied, activate to apply an ascending sort" tabindex="0" aria-disabled="false" unselectable="on" aria-sort="none"{{!}}Name
 
! class="confluenceTh tablesorter-header sortableHeader tablesorter-headerUnSorted" data-column="0" scope="col" role="columnheader" aria-label="Name: No sort applied, activate to apply an ascending sort" tabindex="0" aria-disabled="false" unselectable="on" aria-sort="none"{{!}}Name
Line 70: Line 55:
 
{{!}}- role="row"
 
{{!}}- role="row"
 
{{!}} class="confluenceTd"{{!}}selector
 
{{!}} class="confluenceTd"{{!}}selector
{{!}} class="confluenceTd"{{!}}A string that selects elements. For more information, see https://developer.mozilla.org/en-US/docs/Web/API/Element/matches
+
{{!}} class="confluenceTd"{{!}}String that selects elements. For more information, see https://developer.mozilla.org/en-US/docs/Web/API/Element/matches
 
{{!}} class="confluenceTd"{{!}}String
 
{{!}} class="confluenceTd"{{!}}String
 
{{!}} class="confluenceTd"{{!}}required
 
{{!}} class="confluenceTd"{{!}}required
 
{{!}}- role="row"
 
{{!}}- role="row"
 
{{!}} class="confluenceTd"{{!}}eventName
 
{{!}} class="confluenceTd"{{!}}eventName
{{!}} class="confluenceTd"{{!}}is a string that will be used as the event name when an element matching the selector moves into or outside the viewport.
+
{{!}} class="confluenceTd"{{!}}String used as the event name when an element matching the selector moves into or outside the viewport.
 
{{!}} class="confluenceTd"{{!}}String
 
{{!}} class="confluenceTd"{{!}}String
 
{{!}} class="confluenceTd"{{!}}required
 
{{!}} class="confluenceTd"{{!}}required
Line 89: Line 74:
 
}
 
}
 
</syntaxhighlight>
 
</syntaxhighlight>
|structuredtextwide=
 
|FAQHeading=
 
 
|Status=No
 
|Status=No
 
}}{{Section
 
}}{{Section
Line 96: Line 79:
 
|anchor=callback
 
|anchor=callback
 
|alignment=Vertical
 
|alignment=Vertical
|Media=
+
|structuredtext=When a module loads, callback is executed. No arguments pass to the callback.
|image=
 
|structuredtext=When a module fully loads, callback is executed. No arguments are passed to the callback.
 
|structuredtextwide=
 
|FAQHeading=
 
 
|Status=No
 
|Status=No
 
}}
 
}}
 
}}
 
}}

Revision as of 17:50, December 16, 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 web sites as they appear and disappear from the viewport. This configuration provides 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, configure the elements to track using the following options:

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: See the following table.

Name Description Type Status
selector String that selects elements. For more information, see https://developer.mozilla.org/en-US/docs/Web/API/Element/matches String required
eventName String 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 loads, callback is executed. No arguments pass to the callback.

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