Enable Adobe Data Layer sling:config Upon Form Creation

[kah8150]

Expected Behaviour

When I create a new form using core components I would like the com.adobe.cq.wcm.core.components.internal.DataLayerConfig included in the sling:configs that automatically get created under the auto-generated /conf/forms/path/to/form/sling:configs. Or at least a way to configure what configs get included here.

Actual Behaviour

When I create a form, this path is auto created every time: /conf/forms/path/to/form/sling:configs which includes "com.adobe.aem.wcm.site.manager.config.SiteConfig" and "com.adobe.cq.wcm.core.components.config.HtmlPageItemsConfig" for the theme but I do not see a way to influence this to also include other configs, specifically "com.adobe.cq.wcm.core.components.internal.DataLayerConfig" in this case.

Reproduce Scenario (including but not limited to)

Steps to Reproduce

1. Generate codebase with archetype, include datalayer and forms options.
2. Create new form using core form components template and one of the OOTB themes.
3. Note the new folder /conf/forms/path/to/form and default sling:configs that get created.
4. Also note that the datalayer is not enabled on this form due to the missing sling:config

Platform and Version

AEM Version (mention the exact version in case of cloud SDK)

AEM Cloud Service 2024.5.16461.20240524T172309Z

AEM Forms Version

Latest from AEM CS Core Forms Components: 3.0.28

Sample Code that illustrates the problem

Logs taken while reproducing problem

[rismehta]

@kah8150, thank you for bringing this to our attention. Ideally, when dataLayer is set to y via the archetype, the sling context aware configuration specific to dataLayer is created for the Application ID created via the archetype. However, in case of forms, we automatically create a sling configuration for each form through the form creation UI, as theme is mandatory for a form.

In my opinion, it would be beneficial to have the option to configure the dataLayer within the same UI, ensuring a seamless integration for the dataLayer use-case.

I will discuss this internally with the product management team and provide an update to the ticket accordingly.

In the meantime, you can manually create the dataLayer sling context-aware configuration (via customer code) in the /conf path specific to forms to unblock yourself.

[rismehta]

@kah8150 You can also obtain the data layer sling configuration specific to a form through the Forms Manager UI by following the steps outlined here: Adobe Experience Manager Forms Integration

).

For your reference, I have attached a screenshot.

[kah8150]

Thanks @rismehta for confirming. Yes I was actually hoping to avoid the "Connect to Adobe Analytics" option as it automatically creates a Data Collection Property and Analytics Report Suite for every form this is activated on. We are going to have a lot of forms so this is not sustainable. We have one report suite and data collection property set up and I have it connected to my forms already, the missing piece is the datalayer that fires the events for tracking. Do you have a suggestion for the meantime for how I can extend your Form creation process to also create the DataLayer sling config? I'd rather not have to manually create one for every form, or have some sort of eventlistener if I can help it.

[rismehta]

Thanks @rismehta for confirming. Yes I was actually hoping to avoid the "Connect to Adobe Analytics" option as it automatically creates a Data Collection Property and Analytics Report Suite for every form this is activated on. We are going to have a lot of forms so this is not sustainable. We have one report suite and data collection property set up and I have it connected to my forms already, the missing piece is the datalayer that fires the events for tracking. Do you have a suggestion for the meantime for how I can extend your Form creation process to also create the DataLayer sling config? I'd rather not have to manually create one for every form, or have some sort of eventlistener if I can help it.

Thanks @kah8150. According to Apache Sling Context-Aware Configuration, you can define nested contexts or use a deeper hierarchy of resources in /conf to apply inheritance rules. You could create a sling context-aware configuration at /conf/forms, like this:

By doing so, all created forms would have the data layer enabled by default (you can verify this by checking window.adobeDataLayer in the browser console).

[kah8150]

@rismehta this is great, thank you for this. I either knew this at some point and forgot it worked this way, or just learned something new 👍

I just implemented this workaround and it is working as expected. Much appreciated.

[rismehta]

@kah8150 I'm glad to hear this solved your use case. If you need further assistance, please feel free to open another issue. Closing this as resolved.