Is there a template for creating a data-layer for existing AEM site?

[Prithwiraj_Deb]

Here is the use case. 

1. Our current site runs on AEM on-prem 6.4. This is a headless commerce site with Shopify on the backend running e-comm. features like Shopping Cart, Checkout and Order Management. 

2. The current data-layer in AEM is not robust enough to capture all the events and on top of that one of our overseas team is coming up with a completely new website with new design which I have not seen yet. 

3. I am trying to come up with a template with page by page list of DOM variables (We use Tealium as a tag management solution) that we want in the data-layer. 

Is there a standard template that exists or do I have to create one from scratch? 

[MukeshYadav_ · Accepted solution]

Hi @Prithwiraj_Deb ,

As data layer is nothing just key value pair stored and attached with window object to make it globally accessible.

We can define the data layer at template level and push the required event data or variable (values) to the data layer object when required and emit this global object (data-layer- set of information for tracking purpose) to the desired tracking/ analytics system with their built-in scripts.

In aem it is named as adobeDataLayer which you can find in page component.

window.adobeDataLayer = window.adobeDataLayer || [];

You may refer https://experienceleague.adobe.com/en/docs/experience-manager-learn/sites/integrations/adobe-client-...

https://bluerivermountains.com/en/data-layer/

https://medium.com/@jaykrs/aem-data-layer-usage-for-analytics-d0d3ca237bbc

Thanks

[Prithwiraj_Deb]

Thank you very much @MukeshYadav_ . I was looking for a visual approach to data-layer to explain to the my business team.