Document Properties
Kbid2851K3
Last Modified22-Jun-2020
Added to KB23-Nov-2017
Public AccessEveryone
StatusOnline
Doc TypeGuidelines, Concepts & Cookbooks
ProductICM 7.10

Concept - Google Analytics


1 Introduction

1.1 Business Purpose

Google Analytics is one of the most popular web analytics services (SaaS).

This concept describes how an ICM storefront could be integrated with Google Universal Analytics Enhanced Ecommerce features using Google Tag Manager.

Enhanced Ecommerce allows sites to segment their shopping behavior in a more granular way and performs analysis on:

  • Shopping Behavior
  • Checkout Behavior
  • Product Performance
  • Sales Performance
  • Customer Segments

This information helps marketing specialists to take actions to maximize marketing effect and increase sales by focusing on the most profitable products and customer segments.

Google Analytics also allows to define goals and measure conversion rates or show progression through the checkout process, which allows to understand if there are problems with storefront usability that prevent users from completing an order.

1.2 Glossary

TermDescription
Google AnalyticsWeb Analytics Service offered by Google that tracks and reports website usage. Google Analytics users can review online campaigns by tracking landing page quality and conversions (goals). Goals might include sales, lead generation, viewing a specific page, etc. Collected tracking data are represented in high level dashboard views and in-depth report sets.
Google Tag Manager (GTM)Tag management system created by Google to manage JavaScript and HTML tags used for tracking and analytics on websites. Simplifies integration and maintenance of such tracking and analytics tools inside websites.
Enhanced EcommerceGoogle Universal Analytics Enhanced Ecommerce features enables to measure e-commerce activities like product impressions and clicks, promotion impressions and clicks, addition/removal of products to/from shopping basket, checkout steps and purchases.
Google Tag Manager Container Code SnippetA JavaScript code snippet that needs to be integrated into the storefront HTML to initialize the integration with Google Tag Manager.
Data LayerA JavaScript object, used within the storefront to add e-commerce event data (e.g., add product to cart) that is then transferred to Google Tag Manager.

1.3 References

2 Business Overview

The following table summarizes the participants and steps for Google Analytics integration and usage.

Process ParticipantDescription

Buyers interact with the ICM storefront - browse the products catalog, add products to the basket, perform checkout etc.


ICM renders the corresponding storefront page template, containing the Google Tag Manager Container script snippet. This snippet initializes the dataLayer JS object, used to transfer e-commerce event data to Google Tag Manager. Whenever the buyer triggers an e-commerve event (view product, add product to basket, etc.), ICM pushes details about the e-commerce event into the dataLayer using the specified JSON data format.

"ecommerce":
  "add": {
          "products": [
          {
            "quantity": "1",
            "price": "116.07",
            "name": "A-DATA CH94 Portable 500GB",
            "variant": "Hard_disk_drive_capacity: 500 GB, Colour_of_product: Pink",
            "id": "3950792",
            "category": "Computers/206/219",
            "brand": "A-DATA"
           }
           ]
          },
          "currencyCode": "USD"
},
"event": "addToCart"
<dataLayer>
The dataLayer converts the data and delivers it to a pre-configured container for the webshop in Google Tag Manager.
A pre-configured Google Analytics tag is fired in Google Tag Manager and transfers e-commerce event data to a pre-configured Google Analytics account for the webshop.
Google Analytics stores the e-commerce event data and provides reporting functionality.

Marketing specialists on the webshop owner side analyze the data from Google Analytics reports.

3 Technical Overview

The integration of Google Analytics is done with the help of Google Tag Manager, which is enabled by GoogleTagManagerService, located in f_business/a_storefront/ac_gtm cartridge.

The GoogleTagManagerService is implemented as a managed service based on the Business Tracking Framework.

The business tracking can be integrated into the storefront via interface TrackingSFI.

The Google Tag Manager Service integration uses this mechanism to integrate Google Tag Manager into the storefront.

GTM_Integration_Overview

3.1 Cartridge Structure

The following cartridges support the integration with Google Tag Manager:

Component Set

Cartridge

Description

f_business/a_storefront

ac_gtm

Contains the GoogleTagManager managed service, tracking event handlers and corresponding container classes.

f_business/a_storefront

ac_gtm_google_analytics

Adds the event handling which is relevant for the Enhanced Ecommerce plugin of Google Analytics. Defines the mapping between e-commerce events and corresponding ISML templates, containing the Enhanced Ecommerce tracking code for GTM.

f_business/a_storefront

ac_gtm_sf

Contains the ISML templates, that render snippets which push JSON into the GTM data layer. These snippets are specific for the responsive storefront.

f_business/f_checkout

bc_marketing

Contains tracking events and tracking data objects which are generated from events model stored as a XSD file, located in staticfiles/definition/tracking/v1_0/tracking.xsd. Fire*Event pipelets are also located in this cartridge.

f_business/a_storefront

sld_ch_sf_base

Contains the FireTrackingEvents pipeline, holding the logic for creating and handling the tracking events.

3.2 Tracking Events

Certain events from the Business Tracking Framework are distributed to the GoogleTagManagerService that creates code snippets with a given data structure (dataLayer JSON) to be included in the page source code.

The following diagram displays the events that are currently supported for Google Enhanced Ecommerce features integration.

tracking_events

3.3 Fire Tracking Events

FireTrackingEvents pipeline start nodes should be used whenever a certain tracking event must be fired at runtime.

The pipeline encapsulates the logic for creating the tracking event object from the input values, handling the event over to TrackingMgr and putting the returned tracking data container to the pipeline dictionary.

Fire tracking event directly in ISML template:

Fire Tracking Event in ISML
<ispipeline pipeline="FireTrackingEvents-ViewProductList" alias="dict" params="#ParamMap( ParamEntry('ProductList', ProductBOs), ParamEntry('CurrentSession', CurrentSession), ParamEntry('CurrentUser', CurrentUser), ParamEntry('CurrentRequest', CurrentRequest), ParamEntry('PageName', 'CartRecommendations'), ParamEntry('PageType', 'CartRecommendations'))#" />

Fire tracking event in other pipeline:

3.4 Tracking Data Objects

Tracking events and tracking data objects are defined in XSD and automatically generated as JAXB objects. They just hold the required tracking data in independent format. Example: TrackingProduct, TrackingOrder.

3.5 Tracking Event Handlers

Tracking Event Handlers process the tracking events and create data containers with the required data for the concrete Web Analytics tool data. The main method is handleEvent in which the data container is created and filled with required data.

Handlers use ObjectMappers to map from the tracking data objects in the TrackingEvent into the corresponding format for the concrete Web Analytics tool data objects. They could also access BO layer to retrieve required data that are not available in the TrackingEvent. Each concrete subclass of AbstractGoogleTagManagerEventHandler works with concrete type of TrackingEvent, i.e., OrderPlacedEvent.

tracking_enent_handler

3.6 Tracking Data Containers

Tracking Data Containers contain the data required by the concrete web analytics tool for a specific tracking event. The diagram below shows containers used for Google Analytics integration.

tracking_data_container

3.7 Storefront Integration

This section describes the integration of the Google Tag Manager into the ICM responsive storefront demo application.

For all e-commerce activities on certain parts of the webshop, storefront page template placeholders are included for the tracking tool code, using the IncludeTrackingTool ISML module, located in the bc_marketing cartridge. The logical name of the e-commerce event or related tracking code snippet is specified in the template attribute of the module. Internally, this module finds the registered managed services of the application for tracking that implements the TrackingSFI interface. If the service has a specific tracking code for the specified e-commerce activity, the corresponding ISML template is included. The template renders the specific code snippet for the concrete Web Analytics tool using the prepared data available in the tracking data container.

The following picture provides an overview of the storefront integration for Google Tag Manager tracking code for Enhanced Ecommerce activity, measuring views of product detail:

webtrends_integration

The following table lists the webshop storefrent pages and ISML templates in which the IncludeTrackingTool ISML module is used:

Page

Cartridge

SF ISML

Activity Name

GTM ISML

All

app_sf_responsive

DefaultPageStructure.isml

MainFrameBodyStart

MainFrameBodyStart.isml

Wishlist

app_sf_responsive

Wishlist.isml

ViewWishList

ViewProductList.isml

Recommendations

app_sf_responsive

ProductList.isml

RecommendationsTracking

RecommendedProductData.isml

Product Detail

app_sf_responsive_cm

ProductDetail.isml

ViewProductDetail

MeasureProductDetail.isml

Shopping Cart

app_sf_responsive_cm

Cart.isml

EmptyCart.isml

BasketChangeAdd

BasketChangeRemove

BasketChangeQuantities

BasketChangeVariations

BasketChangeAdd.isml

BasketChangeRemove.isml

BasketChangeQuantities.isml

BasketChangeVariations.isml

Checkout

app_sf_responsive

HeaderProgressBar.isml

CheckoutCart

Checkout.isml

Receipt

app_sf_responsive

CheckoutReceipt.isml

OrderPlaced

OrderPlaced.isml

3.8 Data Layer Code

Whenever a given tracking event is fired, the corresponding handlers should process the data and render the corresponding dataLayer JSON snippet, required by Google Tag Manager.

The following table provides the mapping of tracking events to the corresponding Google Enhanced Ecommerce activities, as well as samples with the expected dataLayer JSON format for each event:


Tracking Event class

Google Enhanced Ecommerce Activity

Sample dataLayer JSON

ViewProductEvent

Product Detail Impressions

{
	"ecommerce": {
		"detail": {
			"actionField": {
				"list": "Product Detail"
			},
			"products": [{
				"price": "115.81",
				"name": "A-DATA CH94 Portable 500GB",
				"variant": "Hard_disk_drive_capacity: 500 GB, Colour_of_product: Blue",
				"id": "3934158",
				"category": "Computers/206/219",
				"brand": "A-DATA"
			}]
		}
	},
	"event": "impressionsPushed"
}

ViewProductListEvent

Product Impressions

{
	"ecommerce": {
		"impressions": [{
			"price": "107.06",
			"name": "A-DATA XPG Gaming Series V2.0, DDR3, 1600 MHz, CL9, 12GB (4GB x 3)",
			"variant": "",
			"id": "7006513",
			"category": "Computers/106/911",
			"list": "CartRecommendations",
			"brand": "A-DATA"
		}, {
			"price": "17.17",
			"name": "Benq MD300",
			"variant": "",
			"id": "1612143",
			"category": "Computers/191/195",
			"list": "CartRecommendations",
			"brand": "Benq"
		}, {
			"price": "29.64",
			"name": "Creative Labs Live! Cam Video IM",
			"variant": "",
			"id": "1664866",
			"category": "Cameras-Camcorders/577",
			"list": "CartRecommendations",
			"brand": "Creative Labs"
		}],
		"currencyCode": "USD"
	}
}

BasketAddProductEvent

Add to Cart

{
	"ecommerce": {
		"add": {
			"products": [{
				"quantity": "1",
				"price": "115.81",
				"name": "A-DATA CH94 Portable 500GB",
				"variant": "Hard_disk_drive_capacity: 500 GB, Colour_of_product: Blue",
				"id": "3934158",
				"category": "Computers/206/219",
				"brand": "A-DATA"
			}]
		},
		"currencyCode": "USD"
	},
	"event": "addToCart"
}

BasketRemoveProductEvent

Remove from Cart

{
	"ecommerce": {
		"remove": {
			"products": [{
				"quantity": "1",
				"price": "115.81",
				"name": "A-DATA CH94 Portable 500GB",
				"variant": "Hard_disk_drive_capacity: 500 GB, Colour_of_product: Blue",
				"id": "3934158",
				"category": "Computers/206/219",
				"brand": "A-DATA"
			}]
		},
		"currencyCode": "USD"
	},
	"event": "removeFromCart"
}

BasketChangeQuantitiesEvent

Add / Remove from Cart

Increase quantity

{
	"ecommerce": {
		"add": {
			"products": [{
				"quantity": "2",
				"price": "115.81",
				"name": "A-DATA CH94 Portable 500GB",
				"variant": "Hard_disk_drive_capacity: 500 GB, Colour_of_product: Blue",
				"id": "3934158",
				"category": "Computers/206/219",
				"brand": "A-DATA"
			}]
		},
		"currencyCode": "USD"
	},
	"event": "addToCart"
}

Decrease quantity

{
	"ecommerce": {
		"remove": {
			"products": [{
				"quantity": "2",
				"price": "115.81",
				"name": "A-DATA CH94 Portable 500GB",
				"variant": "Hard_disk_drive_capacity: 500 GB, Colour_of_product: Blue",
				"id": "3934158",
				"category": "Computers/206/219",
				"brand": "A-DATA"
			}]
		},
		"currencyCode": "USD"
	},
	"event": "removeFromCart"
}

BasketChangeVariationEvent

Add / Remove from Cart

{
	"ecommerce": {
		"add": {
			"products": [{
				"quantity": "1",
				"price": "116.07",
				"name": "A-DATA CH94 Portable 500GB",
				"variant": "Hard_disk_drive_capacity: 500 GB, Colour_of_product: Pink",
				"id": "3950792",
				"category": "Computers/206/219",
				"brand": "A-DATA"
			}]
		},
		"currencyCode": "USD"
	},
	"event": "addToCart"
}, 
{
	"ecommerce": {
		"currencyCode": "USD",
		"remove": {
			"products": [{
				"quantity": "1",
				"price": "115.81",
				"name": "A-DATA CH94 Portable 500GB",
				"variant": "Hard_disk_drive_capacity: 500 GB, Colour_of_product: Blue",
				"id": "3934158",
				"category": "Computers/206/219",
				"brand": "A-DATA"
			}]
		}
	},
	"event": "removeFromCart"
}

ViewCheckoutEvent

Checkout

Checkout Step 1 (Addresses) e-commerce activity:

{
	"ecommerce": {
		"checkout": {
			"actionField": {
				"step": "1"
			},
			"products": [{
				"quantity": "1",
				"price": "21.15",
				"name": "LaCie 130902",
				"variant": "",
				"id": "3115300",
				"category": "Computers/206/298",
				"brand": "LaCie"
			}, {
				"quantity": "1",
				"price": "116.07",
				"name": "A-DATA CH94 Portable 500GB",
				"variant": "Hard_disk_drive_capacity: 500 GB, Colour_of_product: Pink",
				"id": "3950792",
				"category": "Computers/206/219",
				"brand": "A-DATA"
			}]
		}
	},
	"event": "checkout"
}

Checkout Step 2 (Shipping) e-commerce activity:

{
	"ecommerce": {
		"checkout": {
			"actionField": {
				"step": "2",
				"option": "Standard Ground"
			},
			"products": [{
				"quantity": "1",
				"price": "21.15",
				"name": "LaCie 130902",
				"variant": "",
				"id": "3115300",
				"category": "Computers/206/298",
				"brand": "LaCie"
			}, {
				"quantity": "1",
				"price": "116.07",
				"name": "A-DATA CH94 Portable 500GB",
				"variant": "Hard_disk_drive_capacity: 500 GB, Colour_of_product: Pink",
				"id": "3950792",
				"category": "Computers/206/219",
				"brand": "A-DATA"
			}]
		}
	},
	"event": "checkout"
}

Checkout Step 3 (Payment) e-commerce activity:

{
	"ecommerce": {
		"checkout": {
			"actionField": {
				"step": "3",
				"option": "Cash on Delivery"
			}
			"products": [{
				"quantity": "1",
				"price": "21.15",
				"name": "LaCie 130902",
				"variant": "",
				"id": "3115300",
				"category": "Computers/206/298",
				"brand": "LaCie"
			}, {
				"quantity": "1",
				"price": "116.07",
				"name": "A-DATA CH94 Portable 500GB",
				"variant": "Hard_disk_drive_capacity: 500 GB, Colour_of_product: Pink",
				"id": "3950792",
				"category": "Computers/206/219",
				"brand": "A-DATA"
			}]
		}
	},
	"event": "checkout"
}

OrderPlacedEvent

Purchases

{
	"ecommerce": {
		"purchase": {
			"actionField": {
				"revenue": "133.9",
				"shipping": "3.02",
				"coupon": "",
				"affiliation": "",
				"step": 5,
				"tax": "21.38",
				"id": "00000202"
			},
			"products": [{
				"quantity": "1",
				"price": "116.07",
				"name": "A-DATA CH94 Portable 500GB",
				"variant": "Hard_disk_drive_capacity: 500 GB, Colour_of_product: Pink",
				"id": "3950792",
				"category": "Computers/206/219",
				"brand": "A-DATA"
			}, {
				"quantity": "1",
				"price": "21.15",
				"name": "LaCie 130902",
				"variant": "",
				"id": "3115300",
				"category": "Computers/206/298",
				"brand": "LaCie"
			}]
		}
	}
}

4 Known Limitations

  • Enhanced Ecommerce refund activity (full or partial refund of an order) is currently not supported.

  • The Google Tag Manager does not support multiple domains. Each domain requires to have its own account and container.

  • It is recommended to activate GoogleTagManagerService at application level, so it is possible to track the usage of the different applications (web, mobile, etc.) of a customer channel in Google Analytics.

  • Free Google Analytics service has a limit of ten million tracking hits per month. If your needs exceed this limitation then a Google Analytics premium account must be purchased.

  • In case your account sends a large number of tracking hits per day (more than 200.000), updates of Google Analytics reports and metrics could be delayed (up to two days).


Disclaimer

The information provided in the Knowledge Base may not be applicable to all systems and situations. Intershop Communications will not be liable to any party for any direct or indirect damages resulting from the use of the Customer Support section of the Intershop Corporate Web site, including, without limitation, any lost profits, business interruption, loss of programs or other data on your information handling system.

Customer Support
Knowledge Base
Product Resources
Support Tickets