When you first time click on Customization JS, a JavaScript file skeleton is generated. Please consult XTagManager API to get all details about the way to use it, but also about the powerful helpers proposed for inline JavaScript in Configuration NAME columns.
XTagManager API uses a set of libraries. You can create your own ones, and include them in the Customization JS as following:
/*#include std_doc.js*/
Inclusions are recursive, so that you can include a library in a library included in a library... finally included in the Customization JS.
By default, a Library is searched in the same folder than Customization JS, and if they don’t exist, in the Release Path or the Debug Path, depending on Minify activation (checked=Release).
When Minify is checked and a library is only present in Debug Path, the Debug version is used and minified on the fly. Libraries taken from Release Path are supposed to be already minified.
Use Case
A registration form is made of two steps (register, success) without URL change, just an Ajax refresh. Both must be distinguished with two different page names.
Solution
In Customization JS, use stat_trigger.init for these pages (if not already done for all pages), and use the fnChanged parameter with a function spying a content no longer present or visible in the second step. Fall back into stat_trigger.urlChanged in any other case:
stat_trigger.init(null,
function()
{
if (window.location.pathname==='/identity/userregistrationwork' && !stat_trigger.regdone)
{
stat_trigger.regdone=!document.querySelector('div.uniqueID-txt');
return stat_trigger.regdone;
}
if (window.location.pathname==='/identity/IDMSSetPassword' && !stat_trigger.pwddone)
{
stat_trigger.pwddone=!document.getElementById('intPwdId');
return stat_trigger.pwddone;
}
return stat_trigger.urlChanged();
}
);
(function(){addPageEvent(document,'DOMContentLoaded',function(){pageStatInjection();});})();
Then, in Perimeters, differentiate both steps with this status:
PATH ROOT |
LEVEL 2 |
PAGE NAME, EXCLUSION OR PATTERN |
/userregistrationwork |
115 |
userregistrationwork<js:(stat_trigger.regdone?'-success':'')> |
/idp |
115 |
|
/IDMSSetPassword |
115 |
IDMSSetPassword<js:(stat_trigger.pwddone? '-success':'')> |
* |
115 |
|
Use Case
Some CTAs are still not available once page Load event triggered, so that they are missed by injection process.
Solution
In Customization JS, call stat_link.waitRefresh in activateOnLoad, and when they are too much delayed, do it from stat_trigger.doWhen (based on loader nodes presence).
this.activateOnLoad = function(){
if (window.location.pathname.indexOf('/products/')>0) {
var fnLoader=function(){
var a=document.querySelectorAll('.pd-tabs__preloader');
return (a&&a.length>0);
};
stat_trigger.doWhen(function(){stat_link.waitRefresh('a,button');},
function(){return !fnLoader();},
fnLoader);
}
else {
stat_link.waitRefresh('a,button');
}
};
When you first time click on Mirroring JS, a JavaScript file skeleton is generated. Please consult GA Plugin namespace to get all details about the way to use it, but also about the powerful helpers proposed to enrich the Mirroring accordingly to your needs.
By default, the generated Mirroring JS includes the GA Plugin and proposes some entry points to define your mirroring specificities. If you want applying them to several Configurations, copy this JS file in the Debug Path of your installation, give it a generic name, then use it by inclusion in your Customization JS:
/*#include std_ga.js*/
Copyright © 2020, Denis Rousseau - XTagManager