Magento – How to install Google TAG Manager in magento 1.9

googlegoogle-tag-manager

How to install Google TAG Manager (GTM) to Magento 1.9.2 without extension?

enter image description here

Best Answer

The basic GTM code can be added easily using the following three steps -:

Step 1

gtm_head.phtml ---> YourTheme/Magento_Theme/templates/html/gtm_head.phtml

add the following script:

<!-- 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-XXXX');</script>
<!-- End Google Tag Manager -->

Step 2

gtm_body.phtml ---> YourTheme/Magento_Theme/templates/html/gtm_body.phtml

add the following script:

<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-XXXX"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->

Step 3

default .xml file: --->YourTheme/Magento_Theme/layout/default.xml and add this:

<referenceContainer name="head.additional">
 <block class="Magento\Framework\View\Element\Template" name="gtm.head" before="-" template="Magento_Theme::html/gtm_head.phtml" />
</referenceContainer>

<referenceContainer name="after.body.start">
 <block class="Magento\Framework\View\Element\Template" name="gtm.body" before="-" template="Magento_Theme::html/gtm_body.phtml" />
</referenceContainer>

The above will add basic script of GTM code on your Magento 2 store but GTM is all about data and data layers without them there is very little can be done using the basic script of GTM.

For example - for Google Enhanced Ecommerce, you need to create data layers for all the below actions / pages

  • Product Impressions (for category, up-sell, cross-sell and search results) - Wherever you are showing list of products.

  • Product Clicks (for category, up-sell, cross-sell and search results) - Wherever you are showing list of products.

  • Product Detail Impressions (for product detail page)

  • Add / Remove from Cart (for add to cart or remove from cart action)

  • Promotion Impressions (for list of banners / ads)

  • Promotion Clicks (for click of the banner / ad image)

  • Checkout (for checkout / checkout steps)

  • Purchases (for order confirmation page)

  • Refunds (from admin to send refund to GA in case of refunds)

If you are a developer you can add the above data layers in your code using the following layout handlers -:

  • default.xml

  • catalog_category_view.xml

  • catalog_product_view.xml

  • catalogsearch_advanced_result.xml

  • catalogsearch_result_index.xml

  • checkout_cart_index.xml

  • checkout_index_index.xml

  • checkout_onepage_success.xml

Google has given a wonderful code snippets for each page for you to implement by yourself. Just make sure you create exact data layers as specified by Google in their following documentation -:

https://developers.google.com/tag-manager/enhanced-ecommerce

If not then there are quite few extensions available for small amount to buy. Personally I would recommend the following two extension for M1 and M2

M1 Google Tag Manager with Enhanced Ecommerce

M2 Google Tag Manager with Enhanced Ecommerce

source -: How to pass data in Data layer in magento 2.1 - Google tag Manager / Analytics

Related Topic