Configuring Adobe Experience Cloud Integration

This article will walk you through the steps of setting up an integration with the Adobe Marketing Technology stack. The stack combines Adobe Experience Platform WebSDK, Adobe Analytics, Adobe Target or Adobe Journey Optimizer, Adobe Client Data Layer and Adobe Experience Platform Tags. This will let you personalize your pages, automatically track how they perform and track your custom events as well. Before you go further, please also check our native Experimentation capabilities.

Considerations

Before we dive into the technical implementations, let us quickly recap how the Adobe Experience Cloud stack works so we can set the proper expectations.

• Adobe Experience Platform WebSDK: allows the page to interact with the Adobe Experience Platform services
• Adobe Target and Adobe Journey Optimizer: personalizes and optimizes the page with your desired marketing campaigns
• Adobe Analytics: tracks and analyzes the data for the customer journey
• Adobe Client Data Layer: offers a standard method to collect and store client-side events during the customer journey before they are submitted to Adobe Analytics
• Adobe Experience Platform Tags: lets you deploy and manage the tags that power the customer experience

The personalization rules will be dynamically evaluated server-side by Adobe Target, or Adobe Journey Optimizer, and will be delivered as a list of page modifications that will be applied as the page renders each block in order to minimize content flicker. Once the page is fully rendered, the Adobe Analytics instrumentation is done and key business events are captured. Finally, Adobe Experience Platform Tags is loaded and applies the rules and data elements you defined in a delayed manner to limit the performance impact on the initial page load.

In our tests, you can expect a baseline performance impact as below. To this you’d also need to add the overhead of more complex page modifications, especially when using custom JavaScript snippets.

Mobile

Desktop

Rationale

A traditional all-in-one instrumentation done solely via Adobe Experience Platform Tags typically either has a performance on the initial page load, or ends up introducing content flicker if delayed when the personalization of the page is applied.

Our optimized approach builds on top of:

• Top and bottom of page events so we can enable personalization early in the page load, and wait for the page to fully render to report metrics
• Data object variable mapping so we can gather key page metadata for your page in Adobe Analytics

On top of this, we also fine-tuned the code to:

• avoid content flicker as the DOM is dynamically rendered to support AEM EDS and/or SPA use cases
• dynamically load personalization and data layer dependencies only when needed
• Allow mapping AEM RUM data to Adobe Analytics to enrich your reports

Pre-requisites

Before you can leverage this plugin, please make sure you have access to:

• Adobe Experience Platform
• Adobe Target
• Adobe Analytics

You’ll also need to have pre-configured your:

• Datastream in the Adobe Experience Platform to connect to your Adobe Target and Adobe Analytics solutions
• Adobe Experience Platform Tags (Launch) containers, and make sure that
  • the Adobe Client Data layer is enabled, and that you have checked the “Inject Adobe Client Data Layer (ACDL) library if not present”
  • you do not add the Adobe Experience Platform Web SDK, the Adobe Analytics or the Adobe Target extensions. Those is added automatically by our plugin

Installation

• Please follow the technical steps documented in https://github.com/adobe-rnd/aem-martech. Make sure the dataLayerInstanceName in the configuration matches the name you used in the ACDL extension in your Launch container (it will default to adobeDataLayer on both sides).
• Make sure your consent management is properly connected to the plugin as documented
• Commit and push your code
• Setup up an experiment in Adobe Target and preview the page
• Add the Target metadata property to your page to trigger the instrumentation, or the equivalent solution you used to set the personalization config flag
• If the instrumentation is properly done, you should see the following calls in your browser’s Network tab when you load the page. Whether the page is actually modified or not will depend on the configuration you set in Adobe Target.
  • https://edge.adobedc.net/ee/v1/interact: fetches the Adobe Target propositions (i.e. page modifications)
  • https://edge.adobedc.net/ee/v1/collect: tracks a page view event in Adobe Analytics
  • https://edge.adobedc.net/ee/v1/privacy/set-consent: persists the user consent into Adobe Experience Platform
• You are all done!