DataLayer for Google Tag Manager
How To Configure
DataLayer for Google Tag Manager

Integrate Bing UET with Google Tag Manager

Please Note: The settings below require our Datalayer for Google Tag Manager for Magento 2 and some features also require our Enhanced Ecommerce extension.

Product Page View
Tag Configuration
  Tag type : Custom Html

Trigger Configuration
  Trigger: All Custom Events
  Event Name : productPage

HTML

<script>
require(['DataLayerProductApi'], function (dataLayerProductApi) {
    var product = dataLayerProductApi();
    
    <!-- Bing UET Code -->
    window.uetq = window.uetq || []; 
    window.uetq.push('event', '', {
        'ecomm_pagetype': 'product',
        'items': product.getProductCollection(),
        'currency': product.getCurrencyCode()
    });  
    <!-- End Bing UET Code -->
});
</script>
Add To Cart
Tag Configuration
  Tag type : Custom Html

Trigger Configuration
  Trigger: All Custom Events
  Event Name : addToCart

HTML

<script>
require(['DataLayerProductApi'], function (dataLayerProductApi) {
    var product = dataLayerProductApi();
        
    <!-- Bing UET Code -->
    window.uetq = window.uetq || []; 
    window.uetq.push('event', 'add_to_cart', {
        'items': product.getAddedToCartItems(),
        'currency': product.getCurrencyCode()
    });  
    <!-- End Bing UET Code -->
});
</script>

*Enhanced Ecommerce extension required for this functionality.

Remove From Cart
Tag Configuration
  Tag type : Custom Html

Trigger Configuration
  Trigger: All Custom Events
  Event Name : removeFromCart

HTML

<script>
require(['DataLayerProductApi'], function (dataLayerProductApi) {
    var product = dataLayerProductApi();
        
    <!-- Bing UET Code -->
    window.uetq = window.uetq || []; 
    window.uetq.push('event', 'remove_from_cart', {
        'items': product.getRemovedFromCartItems(),
        'currency': product.getCurrencyCode()
    });  
    <!-- End Bing UET Code -->
});
</script>

*Enhanced Ecommerce extension required for this functionality.

Initiate Checkout
Tag Configuration
  Tag type : Custom Html

Trigger Configuration
  Trigger: All Custom Events
  Event Name : checkoutPage

HTML

<script>
require(['DataLayerCheckoutApi'], function (dataLayerCheckoutApi) {
    var checkout = dataLayerCheckoutApi();
             
    <!-- Bing UET Code -->
    window.uetq = window.uetq || []; 
    window.uetq.push('event', 'begin_checkout', {
        'items': checkout.getItems(),
        'currency': checkout.getCurrencyCode(),
        'revenue_value': checkout.getCartTotal()
    });  
    <!-- End Bing UET Code -->    
});
</script>
Purchase
Tag Configuration
  Tag type : Custom Html

Trigger Configuration
  Trigger: All Custom Events
  Event Name : purchase

HTML

<script>
require(['DataLayerPurchaseApi'], function (dataLayerPurchaseApi) {
    var purchase = dataLayerPurchaseApi();
    
    <!-- Bing UET Code -->
    window.uetq = window.uetq || []; 
    window.uetq.push ('event', 'purchase', {
        'event_category': 'ecommerce',
        'revenue_value': purchase.getOrderTotal(),
        'tax': purchase.getOrderTax(),
        'shipping': purchase.getOrderShipping(),
        'coupon': purchase.getOrderCouponCode(),
        'items': purchase.getItems(),
        'currency': purchase.getCurrencyCode()
    }); 
    <!-- End Bing UET Code --> 
});
</script>
Related

Related Extensions

Get more from your Magento2 store!

Enhanced Success Page

Add cross-sell, upsell, related products, social media links and other elements to your order confirmation.

Catalog Hover Image for Magento

Quickly previewing alternative product images on your category list page.

Magento Enhanced E-commerce

If your are using Magento + Google Analytics, then you need Enhanced E-commerce for Google Tag Manager.