Pass digital data layer to Adobe analytics using javascript
Requirement
In general, data is passed to Adobe Analytics on page load. Sometimes it is required to load page content without reloading/refreshing the page. For example, if a web application has page navigation based on the Table Of Content and page refresh, and not a requirement, but content should get updated.
Solution
Without loading a page, content can be fetched from the server side using javascript/ajax and the current page DOM can be replaced with the latest DOM fetched by making an Ajax call. But by doing so, page load analytics will not be triggered, and data will not be sent to Adobe Analytics.
To pass the data to Adobe Analytics we need to create the digitalData layer with the updated content and trigger the analytics event.
Implementation steps
1. Add an onclick function to the link and define and implement the onclick function; let’s say the function name is loadPageContent(linkToPage).
2. As an implementation to the loadPageContent(linkToPage) make an Ajax call to the page and, in the success method, play around with the newly fetched DOM and replace the current page DOM with the clicked link page content DOM.
3. If a digital data layer is available(if set on the server side) on the page DOM, extract it out and put it in the success method after step #2.
4. If the digital data layer is not available in the fetched DOM, create and initialize values in the success method itself after step #2.
5. Once digital data layer initialization is done, add the _satellite.track(‘ajaxPageLoad’); as a last line of the success method. This line will trigger the Adobe Analytics call and send the latest available data in the digital data layer to Adobe Analytics.
_satellite.track(‘ajaxPageLoad‘) to work, a rule needs to be added on Adobe Analytics side with an identifier “ajaxPageLoad” as follows:
References
