Adobe Launch - steps to use AA Product String Builder Search Discovery

ruchitam1208080

27-12-2018

Hi Guys,

Can you please provide me steps by steps to use "AA Product String Builder Search Discovery" extension in tags and how to test it with screenshots.

Thank you.

Accepted Solutions (1)

Accepted Solutions (1)

StewSchilling

MVP

02-01-2019

Here we go. 

I want to start with a bit of reorganization of the data layer. I'm addressing three issues :

1) Making the data layer an Array so that we can use the SDI Data Later Manager extension.

2) Making the product node an array consistent with W3C and GTM SOP.

3) Fixing some syntax errors and refactoring for cleanup.

I also changed the data layer name from digitalData to AppEventData.  I like to avoid using digitalData unless the structure follows the w3c spec.  I also like to avoid using dataLayer unless the structure is in line with GTM standard practice.

Step 1.  Install the Data Layer Manager extension in Launch.

a) Note that the `Data Layer Object Name` is set to `AppEventData`.  If you use some other name for your data layer, this field should be updated to match.

b) Trigger Node ID is set to triggerNode.  You shouldn't need to change this.

c) `Custom Event Prefix` is set to `AppEvent`.  This value gives a name-space for your events to prevent collision with any other events that might be fired in the browser.  You'll see this again when we set up the Launch Rule in Step 3.

Screen Shot 2019-01-02 at 8.34.42 AM.png

Step 2. Install the AA Product Sting Builder Extension.

This step is super easy.  Just go to the Launch Extension Catalog and click "Install" from the extension listing.

Screen Shot 2019-01-02 at 8.43.29 AM.png

From the Install page, just click Save.  There are no configuration options to be set on this page.

Screen Shot 2019-01-02 at 8.46.53 AM.png

Step 3. Create a rule for the `addToCart` event.

a) Create a new Rule in Launch by clicking the "Add Rule" button from the Rules Tab.

b) Within this rule, in the Events section, click "Add".

c) Configure the event as shown below:

i. Note that we are using the Core Extension and the Event Type of Custom Event.

ii. Note that the Custom Event Type field is set to AppEvent:addToCart this is the combination of the Custom Event Prefix set in Step 1 and the event value set in the JSON object that will be pushed to the data layer.

iii. Note that we have selected specific element` and set `Elements matching the CSS selector` to `#triggerNode` (matching the value from the Data Layer Manager configuration setting in Step 1.

Screen Shot 2019-01-02 at 8.51.22 AM.png

Step 4. Configure the Action for this rule.

We will be adding three actions to this rule (two from the Adobe Analytics extension, and one from the AA Product String Builder extension).  When complete, the rule will look like this:

Screen Shot 2019-01-02 at 9.07.34 AM.png

The Clear Variables and Send Beacon actions are simple (I won't detail them here).  Just note the order of actions and make sure that your matches the above.

For the AA Product String Builder - Set Variable action, the configuration should look like this:

Screen Shot 2019-01-02 at 9.12.11 AM.png

Data Layer Settings

Root Data Object : %event.detail.__meta.computedState%

Product Collection Path : product

Product String Core Settings

Category : product (as Static Text)

Product ID : name

Product String Custom Events

event1 : quantity

Product String Merchandising Evars

eVar1 : sku

eVar2 : category

eVar3 : subcategory

Step 5. Add Changed Resources and Build for Development

Step 6. Test on your website

Open your JS console on your website and paste this into the console.

You should see an AA beacon sent with the following s.events and s.products populated.

Screen Shot 2019-01-02 at 9.24.15 AM.png

Answers (10)

Answers (10)

StewSchilling

MVP

19-06-2019

Your root object should be a data element that returns the whole `window.digitalData` object.

the product collection path should be (the string) "transaction.item".

Anything that you want to set on the AA beacon outside of the product string should be set using the AA set variables action.  In your case this would include setting the "purchase" event, setting "s.purchaseID", "s.transactionID", etc.

Any product string (merch syntax) evars or product string custom events are set using the AA Product String Builder's set variables action.

StewSchilling

MVP

03-01-2019

You can use any name you like for the data layer object.  If you change, you must update the Data Layer Manager configuration so that it knows what variable to attach to.   This solution requires a data layer that is structured as a Javascript Array.  I choose not to use `digitalData` since most people seeing this name will assume that the structure follows the W3C CEDDL spec (which is not an Array).   A compromise might be to name it `digitalDataArray` which would help those who expect the data layer to start with `digitalD` then the autocomplete in the console will surface `digitalDataArray` which would let them know that something might be different than expected.

In DTM and Launch, within an event-based rule, you can get the event context by using `%event%` where ever you might otherwise use a data element.  In this case, we have the Data Layer Manager which will dispatch a Custom Event when any JSON object that contains an `event` attribute.  In Launch and DTM you can reference the detail (payload) of a Custome Event triggered rule by using `%event.detail%`.    The magic is that the Data Layer Manager adds __meta.computedState to each pushed event object.  This provides a view of the pushed event and all prior pushed events.

If you inspect AppEventData after pushing a few different events, you'll find that each event will have __meta.computedState.  Also, you'll find a top-level getter at AppEventData.computedState which shows the combination of all event objects on the array.

I'm not totally happy with this cryptic reference. I'm waiting for an enhancement (Add support for referencing event from data element library module. by Aaronius · Pull Request #83 ·... to be pushed to production that will allow us to add a special data element type which will be provided by the Data Layer Manager extension (Data Layer Computed State).  This data element will return the __meta.computedState if the context is that of a Data Layer Manager event.  It will return the top-level computedState if referenced from a context outside of a data Layer event.   I expect that we'll be able to add this in the next few weeks.

nathant81503080

26-11-2019

Hi Stewarts16448458,

How would I go about capturing multiple products within a single order. Let's say I have 5 products and 1 of the products I'd like a quantity of 4. Would I set multiple product strings for each type of item? If so, how would something like that look?

adilk

10-06-2019

Thanks, Stewart

Here's my revised dataLayer object as an array. Should my root object be digitalData.transaction?

Also, for eVars, should I set them as AA set variables Action?

and would the product collection path be .transaction.item or just transaction.item?

Thanks a lot for your help

Capture.JPG

StewSchilling

MVP

03-06-2019

There are a few challenges here.

1) AA Product String Build needs the product collection to be an array.

2) AA Product String Builder needs the quantity to be specified within each item of the product collection.

You have this:

Screen Shot 2019-06-03 at 11.39.13 AM.png

But you need this:

Screen Shot 2019-06-03 at 11.40.59 AM.png

Assuming that you will not be able to change the actual data layer, I suggest doing a transformation in the data element that provides the Root Data Object.   Just create a Core > Custom Code data element as follows:

Then configure the rule action as :

Screen Shot 2019-06-03 at 11.44.50 AM.png

Your question,

In the AA string builder, should I again set custom events if they are already set in the AA "Set variables" action?

No, you should ont set an event in one place - either the AA extension or the AA Product String Extension.  The only events that need to be set in the AA Product String Extension are those events that are to be set within the product string itself.

adilk

02-06-2019

Capture.JPGHi Stewart,

I'm wondering if you could help me with my setup.

My transaction event is supposed to fire on a direct call.

While using this AA string builder, which variables should I populate via AA "Set Variables" Vs "SDI string builder"

In my current workspace report, I can see that the Evars are populating for purchase category/product. However, the events [currency] are showing as 0 while ecommerce variables such as product/category are empty.

In my rule for Purchase event:

Adobe Analytics - Set variables has a few evars + events only

AA string builder has my root object as: %Transaction: Root Object% [where it is a JS var called digitalData.transaction]

Product collection path is set to: .transaction.item [because the object is available in digitalData.transaction.item]

Category is setup as .transaction.item.category as Collection Item Path

Quantity as 1 as Static Text

Unit price as .transaction.item.basePrice as Collection Item Path

Question: In the AA string builder, should I again set custom events if they are already set in the AA "Set variables" action?

I'm attaching a screenshot of the transaction object.

Thanks for reading and your help.

ruchitam1208080

03-01-2019

I have some questions related to above solution:

1)What if i change to digitalData instead of AppEventData. (showing error for me when changed).

2) what is "%event.detail.__meta.computedState%"? How it works

Data Layer Settings

Root Data Object : %event.detail.__meta.computedState%

ruchitam1208080

31-12-2018

Currently, I am trying on localhost website using sandbox account.

I would like to understand the extension from start to end such as the configuration of extension and use of the extension in the tags.

For example:

I want to fire a tag on click of Add to Cart button, I will set the trigger using event - "addToCart" as per below datalayer set:

digitalData.eventData = {

ecommerce: {

product: {

sku: '123456',

name: 'White Polo Shirt',

category: 'Polo',

subcategory:'White',

quantity: 2,

}

}

};digitalData.event = 'addToCart';

})

Please help me to set the configuration based on above datalayer.

Thank you.

StewSchilling

MVP

28-12-2018

I'd be happy to do that.  This extension is HIGHLY configurable and can serve many needs.

Please tell me about your need.  If you can point you the site that you are using it on, that too would be very helpful.

Thanks,

-Stew