Enhanced e-commerce Google Analytics 4

Enhanced Ecommerce Google Analytics is an opportunity to track user actions on the site, starting from viewing the product, ending with ordering it on the site, track the chain of interactions at the level of big data, make systemic conclusions and make decisions on structural changes. The most advanced analytics for online stores.

Now the term enhanced ecommerce no longer exists, this term came to us from Google Analytics Universal, but we decided to leave it because the old version of analytics was classic for many in understanding and algorithms.

Setting up Google Analytics Enhanced Ecommerce 4

Enhanced eCommerce in Google Analytics 4 is essentially the same as Universal Analytics, except that there is no need to enable the Enhanced eCommerce option separately. All events in GA4 can be set up by default, without modifications to the current view.

The setup is done in 2 ways:

• via gtag (data is sent directly to Google Analytics 4);
• via Data Layer (data is sent to the Data Layer library, from which, via an event handler in Tag Manager, it gets to Google Analytics 4).

We will consider the 2nd method, since almost all sites work with Tag Manager.

In Google Analytics 4, each event has a unique name, which is recommended by the system. It will not work to do everything through one event, as in the Universal version.

So, let's go through the events.

Views and impressions of products or items from the list

// Measure product views / impressions
dataLayer.push({ ecommerce: null });  // Clear the previous ecommerce object.
dataLayer.push({
  event: "view_item_list",
  ecommerce: {
    items: [
     {
       item_name: "Triblend Android T-Shirt",       // Name or ID is required.
       item_id: "12345",
       price: 15.25,
       item_brand: "Google",
       item_category: "Apparel", //// Main category
       item_category2: "Mens", //// Subcategory
       item_category3: "Shirts", //// Subcategory
       item_category4: "Tshirts", //// Subcategory
       item_variant: "Gray",  //// Variant
       item_list_name: "Search Results",   /////// Here you specify the location (list) where the product is displayed (main page, category, search result, product filter)
       index: 1, //// Product position in the list
       quantity: 1
     },
     {
       item_name: "Donut Friday Scented T-Shirt",
       item_id: "67890",
       price: 33.75,
       item_brand: "Google",
       item_category: "Apparel",
       item_category2: "Mens",
       item_category3: "Shirts",
       item_category4: "Tshirts",
       item_variant: "Black",
       item_list_name: "Search Results",
       index: 2,
     }]
  }
});

Clicks on a product from the list of items

 
/**
 * Call this function when a user clicks on a product link.
 * @param {Object} productObj An object that represents the product that is clicked.
 */
function onProductClick(productObj) {
  dataLayer.push({ ecommerce: null });  // Clear the previous ecommerce object.
  dataLayer.push({
    event: "select_item",
    ecommerce: {
      items: [{
        item_name: productObj.name, // Name or ID is required.
        item_id: productObj.id,
        item_brand: productObj.brand,
        item_category: productObj.category,
        item_category2: productObj.category_2,
        item_category3: productObj.category_3,
        item_category4: productObj.category_4,
        item_variant: productObj.variant,
        item_list_name: productObj.list_name,  /////// Here you specify the location (list) from which the product was clicked (category, search result, filter)
        index: productObj.index, ///// Product position in the list
        price: productObj.price
      }]
    }
  });
}

Views of information about a product or item

// Measure a view of product details. This example assumes the detail view occurs on pageload,
dataLayer.push({ ecommerce: null });  // Clear the previous ecommerce object.
dataLayer.push({
  event: "view_item",
  ecommerce: {
    items: [{
      item_name: "Donut Friday Scented T-Shirt", // Name or ID is required.
      item_id: "67890",
      price: 33.75,
      item_brand: "Google",
      item_category: "Apparel",
      item_category2: "Mens",
      item_category3: "Shirts",
      item_category4: "Tshirts",
      item_variant: "Black",
      quantity: 1
    }]
  }
});

Adding a product to the cart

// Measure when a product is added to a shopping cart
dataLayer.push({ ecommerce: null });  // Clear the previous ecommerce object.
dataLayer.push({
  event: "add_to_cart",
  ecommerce: {
    items: [{
      item_name: "Donut Friday Scented T-Shirt", // Name or ID is required.
      item_id: "67890",
      price: "33.75",
      item_brand: "Google",
      item_category: "Apparel",
      item_category2: "Mens",
      item_category3: "Shirts",
      item_category4: "Tshirts",
      item_variant: "Black",
      item_list_name: "Search Results", //// We enable this parameter if they click “buy” from the list of products
      index: 1, //// Position in the list, we enable this parameter if they click “buy” from the list of products
    }]
  }
});

Removing an item from the cart

// Measure the removal of a product from a shopping cart.
dataLayer.push({ ecommerce: null });  // Clear the previous ecommerce object.
dataLayer.push({
  event: "remove_from_cart",
  ecommerce: {
    items: [{
      item_name: "Donut Friday Scented T-Shirt", // Name or ID is required.
      item_id: "67890",
      price: 33.75,
      item_brand: "Google",
      item_category: "Apparel",
      item_variant: "Black",
    }]
  }
});

Checkout

/**
 * A function to handle a click on a checkout button.
 */
function onCheckout() {
  dataLayer.push({ ecommerce: null });  // Clear the previous ecommerce object.
  dataLayer.push({
    event: "begin_checkout",
    ecommerce: {
      items: [{
        item_name: "Donut Friday Scented T-Shirt", // Name or ID is required.
        item_id: "67890",
        price: 33.75,
        item_brand: "Google",
        item_category: "Apparel",
        item_category2: "Mens",
        item_category3: "Shirts",
        item_category4: "Tshirts",
        item_variant: "Black",
        quantity: 1
      }]
    }
  });
}

If the checkout process takes place in several stages, then in Google Analytics 4 this is divided into the following additional events:

• add_payment_info (adding payment information);
• add_shipping_info (adding shipping information).

Purchase

dataLayer.push({ ecommerce: null });  // Clear the previous ecommerce object.
dataLayer.push({
  event: "purchase",
  ecommerce: {
      transaction_id: "T12345",
      affiliation: "Online Store",
      value: "59.89",
      tax: "4.90",
      shipping: "5.99",
      currency: "EUR",
      coupon: "SUMMER_SALE",
      items: [{
        item_name: "Triblend Android T-Shirt",
        item_id: "12345",
        price: "15.25",
        item_brand: "Google",
        item_category: "Apparel",
        item_variant: "Gray",
        quantity: 1
      }, {
        item_name: "Donut Friday Scented T-Shirt",
        item_id: "67890",
        price: 33.75,
        item_brand: "Google",
        item_category: "Apparel",
        item_variant: "Black",
        quantity: 1
      }]
  }
});

Above is sending data via the Data Layer protocol. That's half the job. Let's move on.

What do you need to do in Tag Manager for Google Analytics 4 Enhanced Ecommerce?

1. Create tags for each event;
2. For all events except purchase, set the “items” parameter with the value ecommerce.items
3. For purchase, all order parameters are additionally stitched.

Roughly, tags in TGM will look like this:

What do Enhanced Ecommerce reports look like in GA4?

As such, there are 1-2 ready-made ones in the system, the customized ones unfortunately work with big errors, therefore, as before, we do not include them as an example, so as not to waste your time.

One of the ready-made “path to purchase” reports looks like this:

For more detailed information, please contact the agency.

Order a service