Closed michelem09 closed 8 years ago
+1 here!
+1
+1
+1
+1
Please use the github +1 feature on OP's post if you'd like to see this feature implemented.
PR #67 and an angulartics/angulartics#505 adds this feature.
Nice.. but a documentation would be helpful. For those whoe look what it could look like see: https://github.com/angulartics/angulartics-google-analytics/pull/67/commits/d204877dbe00824f8fb82a615680bf8a388f3e9a
How To:
Make sure the scripts are being loaded in your index.html.
<script src="/bower_components/angulartics/dist/angulartics.min.js"></script>
<script src="/bower_components/angulartics-google-analytics/dist/angulartics-ga.min.js"></script>
Include $analytics
in your controller like you typically would.
angular.module('MyApp', ['angulartics', 'angulartics.google.analytics'])
.controller('RootController', function ($scope, $analytics) { ...
Enable the enhancedEcommerce setting in your app config.
angular.module('MyApp', ['angulartics', 'angulartics.google.analytics'])
.config(function ($analyticsProvider) {
$analyticsProvider.settings.ga.enhancedEcommerce = true;
});
Then in your controller you'll need to have something like this to post the order to analytics.
var analytics_order = {
'id': $scope.cart.id, // Transaction ID. Required.
'affiliation': $scope.cart.restaurant.name, // Affiliation or store name.
'revenue': $scope.cart.totals.total, // Grand Total.
'shipping': $scope.cart.totals.shipping, // Shipping.
'tax': 0, // Tax.
'products': [] // Products.
};
if($scope.cart.items && $scope.cart.items.length > 0){ for(var i = 0; i < $scope.cart.items.length; i++){ var analytics_order_item = { 'name': $scope.cart.items[i].description, // Name or ID is required. 'id': $scope.cart.items[i].variant_id, // Product SKU 'price': $scope.cart.items[i].price, 'variant': $scope.cart.items[i].variant_name, // Enhanced Ecommerce only 'quantity': $scope.cart.items[i].quantity }; analytics_order.products.push(analytics_order_item); } }
// Then the money shot $analytics.transactionTrack(analytics_order);
Thanks, yes docs are in need of an update.
@foxinni I am getting an error : $analytics.transactionTrack is not a function
.controller( 'ContactUsCtrl', function( $scope, scrollService, BaseService, AppUtils, $analytics ) { var analytics_order = { 'id': 1321, // Transaction ID. Required. 'affiliation': 321321 , // Affiliation or store name. 'revenue': 6565, // Grand Total. 'shipping': 21524, // Shipping. 'tax': 0, // Tax. 'products': [] // Products. };
$analytics.transactionTrack({analytics_order}); }
Index.html
@sandeepgujela I'm not totally sure. I edited my original post to include the config part that you will need to add. Also double check that you have the angulartics scripts added to the index.html and that they are included in your app at startup.
Also use console.log($analytics)
on that page to make sure the service is available on that page. If that fails the $analytics itself isn't being loaded.
If it does work then It could be a version miss match or a setting thats missing. See original code.
@sandeepgujela The 'require', 'ecommece' command is unnecessary, we take care of that; the code looks odd here:
$analytics.transactionTrack({analytics_order});
I believe you should just call $analytics.transactionTrack.
Verify that you're using angulartics/google-analytics 1.4 and angulartics 1.0 or higher.
Any plan to support ecommerce features too?
https://developers.google.com/analytics/devguides/collection/analyticsjs/ecommerce