How to create a Transaction Tracking via DataLayer

Good to Know 💡- Early adoption Phase (Since August 2024) 

In order to test this feature inside the Early adoption phase, we opened this feature only for the customers who have Google Tag Manager as a DataLayer.

The new page of transaction tracking enables you to create some transaction tracking rules directly linked to your DataLayer. 

Thanks to this feature, you will be able to catch all purchase events based on the rules of the DataLayer. Each time one of your visitors complete one transaction, an automatic hit will be sent into the goals metrics page, and you’ll be able to analyze them: 

  • Inside the reporting 
  • To extract them from our Data Explorer

Requirements

Inside AB Tasty

To create a Custom Tracking via DataLayer you must toggle on the button from the Data Layer Integration page, select a DataLayer and save the step:

The available DataLayers are the following: 

  • Google Tag Manager 
  • Tealium 
  • CommandersAct 

Heads Up❗- Custom DataLayers

We don’t manage Custom DataLayers as we can’t predict its structure, we only support GTM, CommandersAct and Tealium providers.

On your DataLayer 

Google Tag manager 

If you use Google Tag Manager as a DataLayer. This feature is based on the documentation provided by Google here: https://developers.google.com/analytics/devguides/collection/ga4/set-up-ecommerce 

Here is a basic structure of one GTM purchase event:

 gtag("event", "purchase", {
                transaction_id: "T_12345_2",
                value: 30.03,
                tax: 4.90,
                shipping: 5.99,
                currency: "USD",
   items_count: 3 
                coupon: "SUMMER_SALE",
                items: [
                {
                  item_id: "SKU_12345",
                  item_name: "Stan and Friends Tee",
                  affiliation: "Google Merchandise Store",
                  coupon: "SUMMER_FUN",
                  discount: 2.22,
                  index: 0,
                  item_brand: "Google",
                  item_category: "Apparel",
                  item_category2: "Adult",
                  item_category3: "Shirts",
                  item_category4: "Crew",
                  item_category5: "Short sleeve",
                  item_list_id: "related_products",
                  item_list_name: "Related Products",
                  item_variant: "green",
                  location_id: "ChIJIQBpAG2ahYAR_6128GcTUEo",
                  price: 10.01,
                  quantity: 3
                }]
          });
      });

That’s why, once an order is made on your website and once a purchase event is triggerred on your DataLayer, the event must be pushed inside your Google Tag Manager DataLayer this way (see items 10 of this DataLayer): 

Good to Know 💡- Event name 

Our transaction tracking is currently able to track any event with the name “purchase” which is the default event name. Soon, we will allow you to specify it.

Tracking the value of a key in your DataLayer

Create a rule of Transaction Tracking

To create a new rule of Transaction tracking via DataLayer:

  1. From the Transaction Tracking page (Settings > Implementation > Transaction Tracking Management) :  https://app2.abtasty.com/settings/transaction-tracking 
  2. Click New Transaction Tracking on the top right of the table. A modal is displayed:

Good to Know 💡- Custom keys in your DataLayer 

In order to avoid bugs or wrong configuration, and if you have some basic GA4 event, most of the inputs are already set up by default. 

Please verify them and, if needed, enter the correct information in order to have a match between our keys (name of the field you can have on this modal and the keys/values provided by the GA4 event purchase).

Mandatory Fields: 

  • Specify the event to check: By default, the name of this event is purchase. But it can be another one, and it’s not necessary to enter “purchase”. You need to define which event corresponds to your own purchase event on your datalayer. (e.g : transaction_collected, achat, checkout_completed, etc ..)
  • Enter a name for your Transaction Affiliation (ta) : Here you can define a name of the transaction. It’s not necessary to enter “purchase” (but you can). You can enter the name of your choice.
  • Transaction ID (tid)* : Refers to the transaction_id field (ex : T_12345_2 of the event inside this doc).
  • Transaction revenue (tr)*:  Refers to the value field (ex : 30.03 of the event inside this doc).
  • Number of items (icn)* : Refers to the items field. If you select: 
    • Default : If you have one key with the number of items. Let’s imagine a key items_count. This key should be a number. 
    • Sum : If your key contains the quantity of each purchased item, select Sum (ex : 3).
    • Count : If your key contains unitary purchased items, select Count. (ex : 1).

Optional Fields: 

In addition to the required fields, you can add some optional fields in order to have more details inside your transaction. 

  • Shipping (ts) :  Refers to the shipping  field (ex : 5.99 of the event inside this doc).
  • Transaction tax rate (tt) :  Refers to the tax  field (ex : 4.90 of the event inside this doc).
  • Currency (tc):  Refers to the currency  field (ex : USD of the event inside this doc).
  • Coupon Code (tcc):  Refers to the coupon  field (ex : SUMMER_SALE of the event inside this doc).
  • Payment method (pm):  Define which method the visitor uses to pay. There’s no native link with the purchase method of GA4.
  • Shipping method (sm):  Define which shipping method the visitor wants to have. There’s no native link with the purchase method of GA4.
  • Array of items (items):  COMING SOON! Coincides with the key corresponding to the array of objects of all items purchased during the transaction and their information. Allows you to define the following: 

    • Item name (in) : COMING SOON! Coincides with the name of the item purchased.

    • Item price (ip) : COMING SOON! Coincides with the price of the item purchased.

    • Item quantity (iq) : COMING SOON! Coincides with the number of times an item was purchased during the transaction.

    • Item SKU (ic) : COMING SOON! Coincides with the product reference (SKU or product ID) of the item purchased.

    • Item category (iv) : COMING SOON! Coincides with the category of the item purchased.

Matching between the purchase GA4 event and the transaction Hit from AB Tasty

Native purchase GA4 event 

If you have some purchase events from GA4 with the same structure as in the screenshot (or inside the documentation of GA4), you don’t need to edit the fields. The only action you have to is: 

  • Define one Transaction Name (not necessarily purchase. It’s at your discretion) 
  • Click Save

Custom purchase GA4 event 

Obviously, you can have another structure for your purchase event. The only requirement is that the name of the event must be purchase.

USE CASE 1

If you have another structure, you could define by yourself the correct key. Let’s imagine you have one purchase event with this structure: 

gtag("event", "purchase", {
                 transactionID: "T_12345_2",
                 value: 30.03,
                 tax: 4.90,
                 shipping: 5.99,
                curr: "USD",
   coupon_discount: "SUMMER_SALE",
                 articles: [.....]
          });
      });

You must enter the correct values inside the input. For this dedicated use case, the correct input in our modal would be as follows: 

USE CASE 2 (Managing the dot (“.”) inside a key 

For any reason, you could have another structure with some sub-objects. Let’s imagine your purchase event has this kind of structure:

gtag("event", "purchase", {
 transaction : {
  id: T_12345_2
 },
 financial : {
  tax: 4.90,
value: 30.03,
shipping: 5.99,
tax: 4.90,
curr: "USD",
},
order: {
coupon: "SUMMER_SALE",
},
articles: [...]
});

If you have some sub-objects, we are able to retrieve the associated value. Indeed, thanks to the dot (“.”), you can go inside a deeper object. That’s why, for this case, you could configure the rule of transaction tracking like this: 

Retrieving the transaction hit on your own website

Good to Know 💡- URL Page

We are able to catch any purchase event on all pages, and it’s not specific to the checkout URL page. If your IRL is /checkout or /confirmation, or anything else, it’s not a problem. The only requirements are: 

  • Having a purchase event with the name purchase
  • This event must be pushed inside the DataLayer used to create the transaction tracking and connected to AB Tasty

Check the AB Tasty hit

Once a transaction is done on your website, and the purchase event is pushed inside your DataLayer, automatically, an AB Tasty hit (ariane.abtasty.com) is also sent into our AB Tasty collect. You can check it inside the network tab: 

A TRANSACTION hit will be sent into your AB Tasty account. 

Retrieving the transaction hit inside AB Tasty

Once a TRANSACTION hit is sent into your AB Tasty account, you will retrieve the transaction affiliation inside your Goal manager. 

On this page : https://app2.abtasty.com/settings/goals-management?transaction , all transaction affiliations are available.

Here an example of a transaction affiliation based on the transaction rule you have set up with the transaction tracking. You can see that the name of the transaction affiliation is exactly the same as the name of the transaction tracking you configured before. 

The transaction affiliation will be displayed as soon as a few transaction hits will be sent into your AB Tasty account via our collect (cf. checking the AB Tasty hit).

As soon as a transaction affiliation is available, you are able to: 

  • Add the transaction tracking as a goal for your campaigns 
  • Export the listing of all your transactions from the Data Explorer.

Was this article helpful?

/