e-comm: Product Added

The "Product Added" event is fundamental in understanding which products are added to a cart, what variant (SKU) of that product was added, and how many were added. The basic pattern for "Product Added" can easily be modified to become "Product Removed". This pattern is also easily modified for product operations related to wishlists, registries, favorites, and many other user interactions related to one or more products.

For Adobe Analytics, at a minimum we must set the scAdd event and product a single productID in s.products. We'll go a bit further in this example by:

  1. Capturing the product SKU using a product syntax merchandising eVar.

  2. Capturing the number of units added using a product specific numeric custom event.

Overview

We'll start with this event being pushed to our data layer by the application.

window.appEventData = window.appEventData || [];
window.appEventData.push({
  "event": "Product Added",
  "product": [
    {
      "quantity": 3,
      "productInfo": {
        "sku": "HC30ABJ786-XL-GRN",
        "productID": "HC30ABJ786"
      }
    }
  ]
});

We will create a rule in Launch that will build and send a beacon to record the event Adobe Analytics. The steps that we will detail are:

  1. Create a rule triggered by the Data Layer Manager : Data Layer Push for "Product Added"

  2. Add an Adobe Analytics Action to set scAdd in the events string.

  3. Add an AA Product String Builder Action to set the product string Category, ProductID, Merchandising eVars, and Custom Events fields.

  4. Add an Adobe Analytics Action to Send a Beacon

  5. Test this event in the browser console.

After all is said and done, our rule will look like this:

...and the Adobe Analytics beacon will look like this:

Step 1 - Event Trigger: Data Layer Push - Product Added

The event that triggers our rule is provided by the Data Layer Manager extension. Select from the options or type in "Product Added" for Event Name. We get this value from the event key in the data layer push code shown above.

Step 2 - Adobe Analytics - Set Vars

Using the Adobe Analytics extension's Set Variables action, we set scAdd in the events section.

Step 3 - AA Product String Builder - Set Variables

This action works in concert with the Adobe Analytics Set Variables action. Note that we set scAdd using the Adobe Analytics extension, but we are setting the product specific custom events in the AA Product String Builder extension.

In order for a product specific custom event to be honored, it must be properly set within the product string as eventX=someValue AND the event must be added to the events string. The AA Product String Builder takes care of this task for you by integrating all necessary events with any events previously set elsewhere.

For this case we will to set six values.

  1. Root Data Object - Here we are using %Data Layer Root% which is a Context Aware Data Element provided by the Data Layer Manager. It returns a JSON object that represents the current state of the data layer (including events that may have been pushed prior).

  2. Product Collection Path - This tells the Product String Builder how to find the product collection. A product Collection is an Array of objects containing product information.

  3. Category - This populates the first part of the product string. Setting it to "product" is one way of telling Adobe Analytics that this is a "real product". In advanced scenarios we use the product string to represent things like "payments" or "shipments" (and set the Category value accordingly).

  4. Product ID - This is the unique identifier of the product that is being viewed. In this example, the path within the product collection to the Product ID is product[n].productInfo.productID .

  5. Product String Custom Events - For each product specific custom event, we select the event number that will be set and the path within the product collection to its value. In this example there is only one custom event (event31 which we are populating from product[n].quantity) but if we were setting multiple events, the extension takes care of constructing the pipe-delimited string of events and value as required by Adobe Analytics.

  6. Product String Merchandising Evars - For each product syntax merchandising eVar, we must select the eVar number and the path within the product collection to its value. As noted for custom events, multiple merchandising eVars may also be set here. The AA Product String Extension takes care of all of the formatting. Her, we are setting eVar20 to the value of product[n].productInfo.sku.

Step 4 - Adobe Analytics - Send Beacon

This step is pretty basic, but included here to be complete. We are using a Custom Link beacon here and setting the Link Name to "Product Added". There is nothing special about this; use any value that you like.

Step 5 - Testing in the console

We can do an end-to-end test of this rule by building our changes into the development environment, and manually pushing the event object onto our data layer. In the image below, the Adobe Analytics Server call info is provided by a free Chrome plug-in called Debugger for Adobe Analytics.

Last updated