Products that cover the topic Magento 2 Google Analytics 4 (GA4) GTM Extension

How to add Google Tag Manager to Magento 2

 

Google Tag Manager is a free tag management platform that enables you to add, update, and control marketing and analytics tags - such as tracking scripts and pixels on your website or mobile application without repeatedly editing the site’s source code Rather than manually embedding tools like Google Analytics, Facebook Pixel, Google Ads, or Hotjar directly into your website files, you install a single GTM container snippet once. After that, all tracking and marketing tags can be configured and managed through GTM’s web-based interface.

There are multiple ways to add Google Tag Manager to your Magento 2 store both free and paid and let's review each one of them. 

 

METHOD 1 - Add Google Tag Manager to Magento 2 for free, no third party extension required

If you've installed Google Analytics 4 or the already deprecated Universal Analytics you might know that this comes down to adding a small Javascript snippet in every page in your site. With Google Tag Manager the process is absolutely the same and involves the following steps. 

  1. 1. Go to Google Tag Manager an open a new account or login to your existing one
  2. 2. Once done, from the Tag Manager interface go to Admin and select Install Google Tag Manager
  3. 3. You shall see 2 Javascript snippets, one for HEAD section in your site and one for the BODY. The one that matters most is the HEAD one, this is where Javascript is acually executed. Copy this script
  4. 4. Go to your Magento 2 admin panel, then select Content / Design / Configuration.
  5. 5.  Click edit on your Store view
  6. 6. Scroll down to HTML Head section and click to expand it
  7. 7. Paste the copied HEAD snippet in the Scripts & Styles textarea input
  8. 8. Save configuration
  9. 9. Go back to System / Cache management and flush cache. 

That's all.

 

 

 

METHOD 2 - Add Google Tag Manager to Magento 2 using a ready GA4/GTM extension by Anowave

The real strength of Google Tag Manager is called dataLayer[] object. This is a special Javascript object that Google Tag Manager interacts with and performs different actions based on the data available in this object. For example, whenever customer adds item to cart, or goes to checkout, dataLayer[] object receives an event with additional paramaters such as the items added to cart or the items available at checkout. This dataLayer object however is not initialized automatically. Having GTM installed in HEAD is just one part of the equation, it can track basic page views and visits but it will not know about important ecommerce marketing events.

Here our ready GTM & GA4 extension for Magento 2  comes to the rescue 

It can not only add Google Tag Manager to Magento 2 but it will also initialize dataLayer object automatically, it will create all required tags, triggers and variables in Google Tag Manager automatically as well. 

To add Google Tag Manager to Magento 2 with our extension, the steps include: 

  1. 1. Go to Google Tag Manager an open a new account or login to your existing one
  2. 2. Once done, from the Tag Manager interface go to Admin and select Install Google Tag Manager
  3. 3. You shall see 2 Javascript snippets, one for HEAD section in your site and one for the BODY. The one that matters most is the HEAD one, this is where Javascript is acually executed. Copy this script
  4. 4. Go to Stores / Configuration / Anowave / Google Tag Manager GA4
  5. 5. Expand the Google Tag Manager section and insert the HEAD snippet

 

Quick Start Guide & How to

Please find below a useful tips & how-tos

How to install Google Tag Manager on Magento 2 using Anowave GTM & GA4 extension
Step 1: Install Google Tag Manager GA4 extension for Magento 2 by Anowave
While you can install GTM manually, with our app you will get dataLayer[] object initialized automatically, GTM configured flawlessly and everything set without you touching any code To instal the extension you can use direct ZIP upload or more robust COMPOSER installations 1. ZIP installations To install using downloadable ZIP, download the ZIP package from your account at Anowave, then upload to your Magento 2 root folder, unzip and run: bin/magento setup:upgrade 2. COMPOSER installations To intall using COMPOSER run: composer require anowave/package composer require anowave/ec composer require anowave/ec4 Once done, run: bin/magento setup:upgrade
Step 2: Activate the extension
From your profile at Anowave, add your own domain and then copy the generated license key, insert this key in the extension config screen
Step 3: Insert GTM snippet
Go to your account at Google Tag Manager, then select Admin / Install Google Tag Manager. Copy the presented snippet and then insert it in our extension config screen
Step 4: Configure Google Tag Manager automatically
Go to our extension config screen, then expand Google Tag Manager API panel. Click Sign in with Google. Once signed, select your GTM container from the dropdown, select tags/triggers/variables checkboxes and click Save config. Now get yourself a coffee while the app configures your GTM container automatically.
Step 5: Publish the container
Once GTM container is configured, go to your Google Tag Manager account and click PUBLISH. This will make all configured changes take effect immediately. If container is not published, tags may not fire.
Step 6: Check and Verify tracking
The recommended way to check if all tags are firing is to run GTM in Preview mode. To do so, go to your GTM container and click PREVIEW, in the popup add your URL and click Continue. The browser will now connect to your site and it will show a new window that reflects all tags fired on your site.
Step 7: Enable Cookie Consent
GDRP compliance is mandatory, if you aren't using any third party solution yet, you can benefit from the built-in cookie compliance widget. You can activate this widged from the app settings. This will ensure that user's consent is properly communicated to Google servers.
How to configure Google Tag Manager automatically
Step 1: Go to Google Tag Manager extension config screen
To get to config screen, open your Magento 2 admin panel, then go to Stores / Configuration / Anowave / Google Tag Manager GA4 and expand Google Tag Manager API panel
Step 2: Sign in to Google
From the same panel, click Sign in to Google. With this, you will authorize the APP to be able to make changes in your container on your behalf.
Step 3: Select what to configure
Once logged in, you will be redirected back to the admin panel. You will then see a dropdown with your GTM containers and also 3 checkboxes for tags, triggers and variables. You can configure them separately, but it's recommended to check them all so configuration can happen at once.
Step 4: Click SAVE config
Once you've selected your container and selected all checkboxes, click Save config. This will trigger an automatic Google Tag Manager configuration
Step 5: Publish the container
Once GTM container is configured, go to your Google Tag Manager account and click PUBLISH. This will make all configured changes take effect immediately. If container is not published, tags may not fire.
Step 6: Check and Verify tracking
The recommended way to check if all tags are firing is to run GTM in Preview mode. To do so, go to your GTM container and click PREVIEW, in the popup add your URL and click Continue. The browser will now connect to your site and it will show a new window that reflects all tags fired on your site.
How to verify if GTM & GA4 is installed correcly
Step 1: Open Google Tag Manager Preview Mode
In Google Tag Manager click Preview, enter the website URL, and connect Tag Assistant to the site.
Step 2: Verify GTM Container Loads
Confirm the container appears in Tag Assistant and shows a status like Connected with the correct GTM container ID (example: GTM-XXXXXXX).
Step 3: Check Page View Events
Reload the website and verify that standard events such as Page View, Container Loaded, DOM Ready, and Window Loaded are firing in Tag Assistant.
Step 4: Validate Trigger Activation
Open individual tags and confirm the expected triggers are firing on the correct pages and user actions.
Step 5: Inspect Data Layer Values
Review the dataLayer tab in Tag Assistant and confirm key variables such as page type, product IDs, transaction values, and user consent states are populated correctly.
Step 6: Test GA4 Event Tracking
Navigate through the website and perform actions like product views, add to cart, checkout, or form submissions. Verify GA4 events are firing with correct parameters.
Step 7: Confirm Events in GA4 Realtime Reports
Open Google Analytics 4 Realtime Reports and ensure events appear in real time while testing the site.
Step 8: Validate Marketing & Conversion Tags
Use browser developer tools or extensions like Tag Assistant Companion to confirm Google Ads, Meta Pixel, TikTok, or other tracking tags fire successfully without JavaScript errors.

Author: Angel Kostadinov

Extensions for Magento

Anowave is an extension developer for Magento 1.x and Magento 2.x platforms. We provide a wide range of premium extensions for our in-house and public clients. The extensions we offer extend the capabilities of Magento and provide bespoke functionality. They also fill some gaps in the functionality provided by the base platform and help customers choose Magento as their preferred eCommerce platform.

The extensions we offer are part of our full-range Magento service, which also includes a Premium Helpdesk where customers can speak with actual software engineers and have their issues resolved without hassle. Premium-labeled modules also include free installation, configuration, testing, etc.

Find more