One of the glaring omissions in the Enhanced Ecommerce<\/a> reports of Universal Analytics<\/a> is the ability to calculate cart value<\/strong> for products. Cart value<\/em>, here, is the value that has been added to the cart.<\/p>\n This value can be used to query for products that have the highest discrepancy between cart value and generated revenue. These are missed opportunities of the highest caliber.<\/p>\n With some Custom Metrics<\/strong> magic, we can, however, get cart value into our reports, and we can find our most and least \u201ceffective\u201d products with just a glance:<\/p>\n <\/p>\n <\/a><\/p>\n<\/div>\n As you can see, my most revenue-generating product, The Ahava Machine 2.0<\/strong>, also has the most value left in the shopping cart. This is more interesting to me than comparing the buy-to-detail<\/strong> and cart-to-detail<\/strong> ratios, as now I actually have a currency attached to the gap between purchases and cart interactions.<\/p>\n It\u2019s very easy to setup. We will, of course, be using Google Tag Manager<\/a>, here, but with a little tinkering you should be able to set it up with the on-page tracking code as well, if you are archaic enough to still use that. I\u2019m assuming here that you already have Enhanced Ecommerce<\/strong> setup through Google Tag Manager, and you have a valid To get things rolling, you need to create the Custom Metric itself. A product-scoped Custom Metric<\/strong> will be scoped to a single product in a single Enhanced Ecommerce interaction. So, if you send a product-scoped Custom Metric with a product object in the \n \n Subscribe to the Simmer newsletter<\/a> to get the latest news and content from Simo Ahava into your email inbox!\n <\/p>\n <\/span><\/p>\n In the Property settings in your Google Analytics Admin, open Custom Definitions > Custom Metrics<\/strong>, and click + New Custom Metric<\/strong>.<\/p>\n <\/p>\n <\/a><\/p>\n<\/div>\n In the screen that opens, give the Custom Metric a name (I chose Cart Value), select Product<\/strong> as the scope and Currency (Decimal)<\/strong> as the type.<\/p>\n <\/p>\n <\/a><\/p>\n<\/div>\n Remember to make sure the Metric has Active<\/strong> checked, and then click Save<\/strong>.<\/p>\n You should be back in the Custom Metrics screen. Make note of the Index<\/strong> the Custom Metric receives. You\u2019ll need this in a short while.<\/p>\n <\/p>\n <\/a><\/p>\n<\/div>\n Next we\u2019ll head on over to Google Tag Manager, where we\u2019ll modify the Let\u2019s assume that your So it\u2019s a fairly basic affair. With an object like this, you\u2019ll be able to track adds-to-cart no problem through Enhanced Ecommerce.<\/p>\n But if we want to have the product-scoped Custom Metric there, we\u2019ll need to add That would solve it. You\u2019d push the total value of the cart addition for that particular product into the Custom Metric at index 1<\/strong> (which we got from previous chapter), after which you\u2019ll accumulate cart value for that particular product.<\/p>\n On top of that, you\u2019d need to push a negative<\/strong> value for cart removals, right? So the That way you\u2019ll have the correct balance in your Cart Value metric at all times.<\/p>\n But this sucks! It sucks because So let\u2019s do what I did in my previous article<\/a> about modifying the How cool is that? I know, very cool.<\/p>\n First, you\u2019ll need to create a Data Layer Variable for the <\/p>\n <\/a><\/p>\n<\/div>\n This will return the most recent Next, we\u2019ll need a Custom JavaScript Variable<\/strong>, which adds the Custom Metric into the payload, and returns the modified This piece of JavaScript takes the existing The Variable finally returns the modified ![\"Cart](\"https:\/\/www.simoahava.com\/images\/2015\/07\/cart-value.jpg#ZgotmplZ\")
<\/p>\necommerce.add<\/code> (and ecommerce.remove<\/code>) object in dataLayer<\/code> or returned with a Custom JavaScript Variable<\/a>.<\/p>\necommerce.add.products<\/code> Array, the metric can only be queried against that particular product. The metric itself will only apply to the Add To Cart interaction, but you can of course combine valid metrics for the same product as I have done in the screenshot above.<\/p>\n
\n X<\/span><\/p>\n
\n The Simmer Newsletter<\/strong>\n <\/p>\nCreate the Custom Metric<\/h2>\n
![\"New](\"https:\/\/www.simoahava.com\/images\/2015\/07\/custom-metric.jpg#ZgotmplZ\")
<\/p>\n![\"Custom](\"https:\/\/www.simoahava.com\/images\/2015\/07\/custom-metric-settings.jpg#ZgotmplZ\")
<\/p>\n![\"List](\"https:\/\/www.simoahava.com\/images\/2015\/07\/custom-metric-list.jpg#ZgotmplZ\")
<\/p>\necommerce.add<\/code> object to include the new Custom Metric with the value that was added to cart.<\/p>\nSend the Custom Metric with the product object<\/h2>\n
ecommerce.add<\/code> object looks like this in dataLayer<\/code>:<\/p>\ndataLayer.push({\n 'event'<\/span> : 'addToCart'<\/span>,\n 'ecommerce'<\/span> : {\n 'add'<\/span> : {\n 'products'<\/span> : [{\n 'id'<\/span> : '42'<\/span>,\n 'name'<\/span> : 'The Ahava Machine 2.0'<\/span>,\n 'brand'<\/span> : 'AHAVA'<\/span>,\n 'price'<\/span> : '3999.90'<\/span>,\n 'quantity'<\/span> : '2'<\/span>,\n 'variant'<\/span> : 'Awesome|Kick-ass'<\/span>\n }]\n }\n }\n});\n<\/code><\/pre>\n<\/div>\nmetricX<\/code> into<\/em> the product object in the products<\/code> Array like this:<\/p>\n...\n'products'<\/span> : [{\n 'id'<\/span> : '42'<\/span>,\n 'name'<\/span> : 'The Ahava Machine 2.0'<\/span>,\n 'brand'<\/span> : 'Ahava'<\/span>,\n 'price'<\/span> : '3999.90'<\/span>,\n 'quantity'<\/span> : '2'<\/span>,\n 'variant'<\/span> : 'Awesome|Kick-ass'<\/span>,\n 'metric1'<\/span> : '7999.80'<\/span>\n}]\n...\n<\/code><\/pre>\n<\/div>\necommerce.remove<\/code> object for when you want to remove one of the Ahava Machines (why would you, seriously?) looks like this:<\/p>\ndataLayer.push({\n 'event'<\/span> : 'removeFromCart'<\/span>,\n 'ecommerce'<\/span> : {\n 'remove'<\/span> : {\n 'products'<\/span> : [{\n 'id'<\/span> : '42'<\/span>,\n 'name'<\/span> : 'The Ahava Machine 2.0'<\/span>,\n 'price'<\/span> : '3999.90'<\/span>,\n 'quantity'<\/span> : '1'<\/span>,\n 'metric1'<\/span> : '-3999.90'<\/span>\n }]\n }\n }\n});\n<\/code><\/pre>\n<\/div>\nmetric1<\/code> is purely<\/em> for Google Analytics. It\u2019s not generic! dataLayer<\/code> should be as generic as possible.<\/p>\necommerce<\/code> object using a Custom JavaScript Variable. We\u2019ll add the Custom Metric dynamically<\/em> using a Custom JavaScript Variable.<\/p>\nModify the \u2018ecommerce\u2019 object in the Data Layer<\/h2>\n
ecommerce<\/code> object, just as I did in the article linked to a paragraph or two ago. It looks like this:<\/p>\n![\"Data](\"https:\/\/www.simoahava.com\/images\/2015\/07\/dlv-ecommerce.jpg#ZgotmplZ\")
<\/p>\necommerce<\/code> object stored in the Data Layer. Since we\u2019re working with the Add To Cart or Remove From Cart events, it will return the ecommerce.add<\/code> or ecommerce.remove<\/code> object, respectively. This makes sense, right?<\/p>\necommerce<\/code> object to your Tag. You can name it whatever you want, e.g. {{JS – Modified EEC Cart Object}}<\/strong>. The Custom JavaScript would look like this:<\/p>\nfunction<\/span>() {\n try<\/span> {\n var<\/span> index = '1'<\/span>; \/\/ Change to reflect the Custom Metric Index\n<\/span> var<\/span> ecom = {{DLV - ecommerce}};\n var<\/span> i, len, prefix, obj;\n if<\/span> ('add'<\/span> in<\/span> ecom) {\n prefix = ''<\/span>;\n obj = 'add'<\/span>;\n } else<\/span> if<\/span> ('remove'<\/span> in<\/span> ecom) {\n prefix = '-'<\/span>;\n obj = 'remove'<\/span>;\n }\n if<\/span> (typeof<\/span> prefix != 'undefined'<\/span>) {\n for<\/span> (i = 0<\/span>, len = ecom[obj]['products'<\/span>].length; i 1) {\n ecom[obj]['products'<\/span>][i]['metric'<\/span> + index] =\n prefix + (ecom[obj]['products'<\/span>][i]['price'<\/span>] *\n ecom[obj]['products'<\/span>][i]['quantity'<\/span>]);\n }\n }\n return<\/span> {'ecommerce'<\/span> : ecom};\n } catch<\/span>(e) {\n return<\/span> {'ecommerce'<\/span> : {{DLV - ecommerce}}};\n }\n}\n<\/code><\/pre>\n<\/div>\necommerce.add<\/code> or ecommerce.remove<\/code> object, and cycles through all the products stored within. For each product, it calculates the product\u2019s price<\/code> multiplied by its quantity<\/code>. This gives the total value for that product in the cart interaction. This value is then stored in the metricX<\/code>, and X is defined in the beginning using the index<\/code> variable. The value is positive if it was an Add To Cart action, and negative if it was a Remove From Cart action.<\/p>\necommerce<\/code> object, which is then used by your Tag as instructed in this article<\/a>. If you can\u2019t bother to read through the linked article, you will need to change your Tags\u2019 Enhanced Ecommerce settings to not use the Data Layer, but rather retrieve the data from the Custom JavaScript Variable you just created.<\/p>\n
![\"Tag](\"https:\/\/www.simoahava.com\/images\/2015\/07\/tag-settings.jpg#ZgotmplZ\")
<\/p>\n