I'm currently implementing Google Analytics enhanced ecommerce. When I buy something in my dev env I check my dev analytics Shopping Behavior and I only see values in All Sessions and Sessions with Transactions, but nothing in between. My code is below. Before or after each ga('ec') & ga('send') pair I sometimes fire an event for normal analytics. Is there anything wrong with my code?
// All values are angular expressions that I've
// double triple checked to make sure they give good values
ga('ec:addImpression', 'detail',{
'id': $location.search().tripToken,
'name': $scope.holds[a].value,
'price': $scope.holds[a].price,
'category' : tileDisable
});
ga('send','pageview')
// Next GA fire a bit later
ga('ec:addProduct', 'checkout', {
'id': $location.search().tripToken,
'name': optionType,
'price': $scope.getOptionPrice(optionType),
'quantity': parseInt($scope.baseInfo.total_travelers)
});
ga('send','pageview');
// A bit later
ga('ec:setAction', 'purchase', {
'id': $scope.userData.option_type,
'affiliation': $scope.userData.token,
'revenue': $scope.userData.option_price * $scope.baseInfo.total_travelers
});
ga('send','pageview');
For common impressions you have to remove the 'detail'
ga('ec:addImpression' *** REMOVE ,'detail'***,{
'id': $location.search().tripToken,
'name': $scope.holds[a].value,
'price': $scope.holds[a].price,
'category' : tileDisable
});
Then when a product is clicked you need to add
ga('ec:addProduct', {
'id': 'P12345',
'name': 'Android Warhol T-Shirt',
'category': 'Apparel',
'brand': 'Google',
'variant': 'black',
'position': 1
});
ga('ec:setAction', 'click', {list: 'Search Results'});
//Remember to add a (non interaction if you wish) event here in order to send the data to GA
ga('send','event','whatever-value');
The last step would be adding the clic (add to cart) for the detail page:
ga('ec:addProduct', {
'id': product.id,
'name': product.name,
'category': product.category,
'brand': product.brand,
'variant': product.variant,
'price': product.price,
'quantity': product.qty
});
ga('ec:setAction', 'add');
// Send data using an event again (depends on user interaction)
ga('send', 'event', 'UX', 'click', 'add to cart');
In case you want to see a live example please visit official Google's demo:
http://enhancedecommerce.appspot.com/
Related
Assuming that I need to send some dataLayer info to Google Tag Manager, I will need this:
dataLayer.push({
'ecommerce': {
'currencyCode': 'EUR', // Local currency is optional.
'impressions': [
{
'name': 'Triblend Android T-Shirt', // Name or ID is required.
'id': '12345',
'price': '15.25',
'brand': 'Google',
'category': 'Apparel',
'variant': 'Gray',
'list': 'Search Results',
'position': 1
},
{
'name': 'Donut Friday Scented T-Shirt',
'id': '67890',
'price': '33.75',
'brand': 'Google',
'category': 'Apparel',
'variant': 'Black',
'list': 'Search Results',
'position': 2
}]
}
});
The question is: do I need to manually write the JSON into my page or the gtm will do this for me after inserting the gtm tracking code into my page?
After searching some tutorials online, all the helpful info I found was how to configure the TagManager account but nobody talks about how the script is generated.
You have to add the script in the page. It will not be generated automatically, but the parameter values will be recognized automatically It your GTM and GA configuration is right (I mean you don't have to create the variables in GTM but you have to create the ecommerce construct in the page with the values of your products).
I’m trying to implement Google Tag Manager dataLayer with the help of a developer. The devs are saying that everything is implemented the way it should be, but I can’t see the dataLayer information within the GTM debugger. I want to set Enhanced eCommerce GA and I have sent the documentation over, but it is still not working for some reason.
Here is the code that I can see once I check the page source. It's on the product page:
<!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-M8VNL5N');</script>
<!-- End Google Tag Manager -->
<script>
dataLayer.push({
'event': ‘ProductView'
'ecommerce': {
'detail': {
'actionField': {},
'products': [{
'name': ‘Product Name’,
'id': '58141',
'price': '545.00',
'brand': ‘Product Brand’,
'category': ‘Product Category’,
}]
}
}
});
</script>
Can you guys see something that it’s not supposed to be like that? I’m not good with JS yet and I can’t find where the issue is coming from.
I would greatly appreciate your help!
Best!
Try this, there were weird quotes and missing commas.
dataLayer.push({
'event': 'ProductView', //comman was missing here and weird quote
'ecommerce': {
'detail': {
'actionField': {},
'products': [{
'name': 'Product Name', //weird quote here
'id': '58141',
'price': '545.00',
'brand': 'Product Brand', //weird quote
'category': 'Product Category', //weird quote
}]
}
}
});
Result:
We're implementing GA conversion tracking with GTM per the following documentation, but I'm not finding any information about how to handle discounts (coupons) at the order level.
https://support.google.com/tagmanager/answer/6106097?hl=en
https://developers.google.com/analytics/devguides/collection/analyticsjs/ecommerce
I can send revenue, shipping, and tax, but these won't total correctly for orders that include a discount. If an order is placed as follows:
T-Shirt: $5
Socks: $5
subtotal: $10
tax: $2
shipping: $3
discount: -$5
order total: $10
Should my dataLayer look like this?
<script>
dataLayer = [{
'transactionId': '1234',
'transactionAffiliation': 'Acme Clothing',
'transactionTotal': 10,
'transactionTax': 2,
'transactionShipping': 3,
'transactionProducts': [{
'sku': 'DD44',
'name': 'T-Shirt',
'category': 'Apparel',
'price': 5,
'quantity': 1
},{
'sku': 'AA1243544',
'name': 'Socks',
'category': 'Apparel',
'price': 5,
'quantity': 1
}]
}];
</script>
Will that cause any inaccuracies or inconsistencies in GA?
A co-worker and I are tackling the same question right now.
Before I get into that though you should never, ever declare your dataLayer like that. Sadly it seems to be the way that Google themselves do it in all their code examples, but it's incredibly dangerous because it will overwrite your existing dataLayer with a new one that only contains those key : value pairs. Instead check if dataLayer exists, creating it if it doesn't, and push to it.
window.dataLayer = window.dataLayer || [];
dataLayer.push({
'key' : 'value'
});
Additionally assuming you've switched over to Universal Analytics consider toggling Enhanced Ecommerce Tracking. It's simultaneously a much more powerful, and cleaner implementation of ecommerce tracking.
So far we've come up with a couple seemingly workable approaches. You can ignore the discount all together, like you did above, and report the total revenue manually after the discount has been applied. One thing I would add if you switch to Enhanced Ecommerce is a coupon code to acknowledge that a product has a discount applied.
<script>
window.dataLayer = window.dataLayer || [];
dataLayer.push({
'ecommerce': {
'purchase': {
'actionField': {
'id': '1234',
'affiliation': 'Acme Clothing',
'revenue': '10.00',
'tax':'2.00',
'shipping': '3.00',
'coupon': 'SUMMER_SALE' //Transaction-scope coupon. This would
//be where you'd include discounts like '$10 off purchases of $50 or more'
},
'products': [{
'name': 'T-Shirt',
'id': 'DD44',
'price': '5.00',
'category': 'Apparel',
'quantity': 1
},
{
'name': 'Socks',
'id': 'AA1243544',
'price': '5.00',
'category': 'Apparel',
'quantity': 1,
'coupon': 'FREE_SOCKS' //Product-scope coupon. This would be for
//discounts like 'free socks with purchase of a t-shirt'
}]
}
}
});
</script>
Alternatively you can enter the discounts as negative value SKUs and track them as their own line items in the transaction.
<script>
window.dataLayer = window.dataLayer || [];
dataLayer.push({
'ecommerce': {
'purchase': {
'actionField': {
'id': '1234',
'affiliation': 'Acme Clothing',
'revenue': '10.00',
'tax':'2.00',
'shipping': '3.00'
},
'products': [{
'name': 'T-Shirt',
'id': 'DD44',
'price': '5.00',
'category': 'Apparel',
'quantity': 1
},
{
'name': 'Socks',
'id': 'AA1243544',
'price': '5.00',
'category': 'Apparel',
'quantity': 1,
},
{
'name': 'Socks-Discount',
'id': 'free-socks',
'price': '-5.00',
'category': 'Apparel',
'quantity': 1,
}]
}
}
});
</script>
Ultimately my recommendation is to mirror the logic for how you're handling the discount in the cart itself. If discounts are their own line items with their own SKUs in your cart report them in GA the same way. If coupon codes make more sense do that. You can even combine the two if you'd like.
Use the coupon field to specify the fact that the transaction and/or product is being discounted. e.g.
"coupon" : "10% summer sale" or just "general discount"
Then use a custom metric (scope=hit, format=decimal) to track the total amount of discount applied for the transaction.
'dimension1': '50.0'
Ref: https://developers.google.com/tag-manager/enhanced-ecommerce#checkout
Your transaction total in the DL should get pushed to the addTrans call. So just make sure whatver value you send to it is what you want to send. GA does not care how you define revenues.
I'm developing a tag, but the product, wines, has 5 categories, like country, region, type of grape, etc...
However, the dataLayer contains a slot for only 1 category.
'transactionProducts': [{
'sku': 'DD44',
'name': 'T-Shirt',
'category': 'Apparel',
'price': 11.99,
'quantity': 1
}]
I need this:
'transactionProducts': [{
'sku': 'DD44',
'name': 'T-Shirt',
'category': ['Category 1','Category 2','Category 3'],
'price': 11.99,
'quantity': 1
}]
Is possible? Works correctly?
Putting the categories into an array won't work as the field only accepts a single string. You can use a pipe (or anything)-delimited string instead:
'category': 'Category 1|Category 2|Category 3',
I have already enabled e-commerce for the website i am working on. I cannot figure it out. The following is the snippet at the end of my thank you page:
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-HIDE_ME');
ga('require', 'ecommerce', 'ecommerce.js');
ga('send', 'pageview');
ga('set', 'currencyCode', 'EUR');
ga('ecommerce:addTransaction', {
'id': '64807', // Transaction ID. Required.
'affiliation': 'my company',// Affiliation or store name.
'revenue': '117,00',// Grand Total.
'shipping': '0', // Shipping.
'tax': '0'// Tax.
});
ga('ecommerce:addItem', {
'id': '64807',// Transaction ID. Required.
'name': 'Sleeping Beauty Musical 1', // Product name. Required.
'sku': 'Sleeping Beauty', // SKU/code.
'category': 'muziektheater', // Category or variation.
'price': '19,00', // Unit price.
'quantity': '1'// Quantity.
});
ga('ecommerce:addItem', {
'id': '64807', // Transaction ID. Required.
'name': 'Sleeping Beauty Musical 2', // Product name. Required.
'sku': 'Sleeping Beauty', // SKU/code.
'category': 'muziektheater',// Category or variation.
'price': '16,00',// Unit price.
'quantity': '1' // Quantity.
});
ga('ecommerce:addItem', {
'id': '64807', // Transaction ID. Required.
'name': 'The Lion King Musical', // Product name. Required.
'sku': 'Lion King', // SKU/code.
'category': 'dans', // Category or variation.
'price': '41,00', // Unit price.
'quantity': '2' // Quantity.
});
ga('ecommerce:send');
update
thanks yahelc for editing my code. I found that i have to turn on universal for the clients website. but the client is already using the old google analytics and i am not sure how to turn on both.....ga.js and analytics.js..........
You can run both ga.js and analytics.js simultaneously, but you need create the GA profile as a Universal Analytics profile FIRST (you can't update it after it's been created).