0
votes

This is my first post, after many years of lurking in the corners of StackOverflow.

I am currently trying to implement Google Analytics Enhanced Ecommerce to track product impressions, product detail views, additions and removals from the shopping basket and checkouts of those products using Universal Analytics (not Tag Manager).

Things that have worked so far

I've had some success in getting product impressions and detail views to be logged so far. Here's a shot of what happens when I visit the detail view for a group of our products on our site in the Google Analytics User Explorer:

Screen cap showing detail view of products in Google Analytics dashboard

This is both expected and intended.

What I am stuck on

I had hoped to extend this level of tracking to record which products users add to their baskets using the syntax Google offer in their documentation.

As the add to basket event must still allow the pageview to be recorded by the Google Analytics tracker, my implementation of Google's instructions creates a new named tracker that is used just for that event, separating it from the pageview tracker.

My implementation

Here is how I have implemented it:

function gaAddRemoveCart( action, productId, csrfToken ) {

    $metadataPromise = getProductMetadata( 'id', productId, csrfToken );
    $metadataPromise.done( function( data ) {

        metadata = data.payload[0];

        console.log(metadata);

        ga('create', 'UA-********-*', 'auto', 'basketAdd');
        ga('require', 'ec');
        ga('basketAdd.ec:addProduct', {             // Provide product details in an impressionFieldObject.
            'id': metadata.productId,               // Product ID (string).
            'name': metadata.productName,           // Product name (string).
            'category': metadata.productCategory,   // Product category (string).
            'brand': metadata.productBrand,         // Product brand (string).
            'list': metadata.productList,           // Product list (string).
            'variant': metadata.productVariant,     // Product variant (string).
            'position': metadata.productPosition    // Product position (number).
        });

        if ( action == 'add' ) {
            ga('basketAdd.ec:setAction', 'add');
            ga('basketAdd.send', 'event', 'UX', 'click', 'add to cart');     // Send data using an event.
        } else if ( action == 'remove' ) {
            ga('basketAdd.ec:setAction', 'remove');
            ga('basketAdd.send', 'event', 'UX', 'click', 'remove from cart');     // Send data using an event.
        }


    });
}

This function is called like so:

gaAddRemoveCart( 'add', metadataId, <?php echo "'{$_SESSION['CsrfToken']}'"; ?> );

The metadata ID is passed to gaAddRemoveCart(), which then in turn fetches this metadata with the function getProductMetadata(), which is then used to add a product to the GA tracker in the ga('basketAdd.ec:addProduct'... command.

Expected vs actual

I would expect the product data for the basket add to appear in the Analytics dashboard in the same way it does for a product view, but the dashboard only shows that a basket add occurred — not what was added to the basket:

Screencap showing a basket add in the GA dashboard

The network tab of my browser shows that none of the product details are being sent as parameters:

Params of request to submit add to basket event to Google Analytics

I have of course checked that the metadata for the product has been found and pulled into the function. This is the output of the aforementioned console.log(metadata); line in my implementation:

Product metadata the my function tries to submit to Google Analytics

To test whether the null values in the metadata could have been to blame, I tried updating my ec:addProduct command to:

ga('basketAdd.ec:addProduct', {   // Provide product details in an impressionFieldObject.
    'id': 'TEST1',                  // Product ID (string).
    'name': 'Test product',         // Product name (string).
    'category': 'Test cat',         // Product category (string).
    'brand': 'Test brand',          // Product brand (string).
    'list': 'Test list',            // Product list (string).
    'variant': 'Test variant',      // Product variant (string).
    'position': 1                   // Product position (number).
}); 

This however yielded the same result. The product info was just not sent along to GA along with the click event.

In summary

I've searched far and wide but haven't been able to find a solution to this issue. I'm not even sure if I haven't misunderstood the functionality of Google Analytics Enhanced Ecommerce here and not realised that what I'm attempting isn't in fact possible.

I would be super appreciative of any help anyone with experience of tracking basket adds with Google Analytics Enhanced Ecommerce can offer!

1
This post just earnt me a tumbleweed badge from StackOverflow. I guess a badge is always nice, but I had hoped my detailed write-up hadn't been in vain! A follow-up however. There is something in the GA docs that here that is likely relevent, though I do define the action type in my code: developers.google.com/analytics/devguides/collection/… "If a product action is not specified, all product definitions included with the hit will be ignored. Must be one of: detail, click, add, remove, checkout, checkout_option, purchase, refund."Andrew Dunn

1 Answers

0
votes

So! I discovered the reason for my issue, and it's fairly embarrassing, as, in retrospect, it was exceptionally simple.

The problem was simply that my custom-named tracker (basketAdd) had not imported the Enhanced Ecommerce module.

Why?

Because I neglected to prepend the name of the tracker to the ga('require', 'ec'); command.

I have updated it to the following:

ga('basketAdd.require', 'ec');

Lo and behold, that fixed my issue. I'm not sure if there are any takeaway lessons for anyone else here, other than this:

Check your code for consistency. Now excuse me while I try to practice what I preach!