Customizing the BigCommerce Google Analytics Enhanced Ecommerce Integration

An overview of Google Analytics Enhanced Ecommerce on BigCommerce

Google Analytics Enhanced Ecommerce (GAEE) is a set of additional functionality within Google Analytics that enables merchants running ecommerce stores to better understand how their business is performing.

Setting up the Enhanced Ecommerce portion of Google Analytics typically requires a lot of custom development work well beyond setting up the standard javascript that is used for installing Google Analytics on a website.

We’ve made leveraging GAEE easier when using BigCommerce. Way way easier. Merchants can get the majority of the GAEE functionality by simply entering in their Google Analytics Property ID in the BigCommerce Control Panel under Advanced Settings > Web Analytics. No custom dev work required.

However, the really advanced functionality comes when developers such as yourself leverage a set of functionality we call “data tags” to customize the integration to provide merchants with more in depth reporting.

Leveraging data tags to customize the BigCommerce Google Analytics Enhanced Ecommerce integration

Below I’ll talk about some of the things you could leverage data tags for. For information on how to get started, see our developer documentation here. Quick tip: you will need to know how to use Stencil CLI to complete all the steps.

Go further with the Product list performance report

This is one of the most powerful reports within GAEE as it helps merchants understand how various lists of products on their storefront are performing (from view, to click, all the way through to checkout). It helps merchants understand which product categories (which are lists of products) are performing the best. Or how various search results are performing (again, a list of products).

GAEE can also be used for unique concepts that you’re building into your theme or that you are building as an app developer. Let’s say you have a set of functionality that uses AI (artificial intelligence) and ML (machine learning) to recommend products to customers. That is also fundamentally a list of products. By instrumenting the appropriate data tags on that list, you can enable merchants to get reporting on the performance of this feature from within GAEE.

Here’s a code sample of how this could work

<ul data-list-name="My ml-created list">
<li
data-event-type="list"
data-position="1"
data-entity-id="{{product.id}}"
data-product-price="{{product.price.with_tax.value}}"
data-name="{{product.name}}">
{{product.name}}
</li>
</ul>

Side note: this specific report only works if the theme is set up to use data tags.

Custom dimensions and BigCommerce Customer Groups

Custom dimensions are another powerful way to customize the data sent to GAEE. One possibility for how you might leverage the data tag solution we’ve built is to pass which customer group a given customer belongs to in the events sent to GAEE. By adding in a “customer group” custom dimension in the data tags, you can enable merchants to build out custom segments in GAEE that are tied to the BigCommerce Customer Groups.

To return to our previous example, a machine learning application that recommends products to customers, let’s say a merchant has a customer group for their retail customers and a separate one for their wholesale customers, a common B2B/B2C scenario popular with BigCommerce. With this functionality they would be able to see how their Retail and Wholesale customers are behaving on their storefront within GAEE.

Here’s a code sample of how this could work

<ul data-list-name="My ml-created list">
<li 
data-event-type="list"
data-position="1"
data-entity-id="{{product.id}}"
data-product-price="{{product.price.with_tax.value}}"
data-name="{{product.name}}"
data-customer-group="{{customer.customer_group_name}}">
{{product.name}}
</li>
</ul>

These are just some of the possibilities with the data tag solution. We hope you find this valuable and we look forward to hearing your feedback! We welcome your feedback in the comments below.

For details on how to instrument data tags, check out the developer documentation here.