Google Tag Manager implementation for ScandiPWA, supporting Google Analytics Enhanced Ecommerce
Please note that the support for GA4 has been implemented exclusively for the following versions: 2.4.4-p2 Magento 6.1.1 SPWA, 2.4.5-p4 Magento 5.3.3 SPWA
DISCLAIMER
This extension is standalone. It provides all necessary ScandiPWA and Magento modules. No third-party modules are required.
{ "event": "errorMessage", "message": "Something went wrong!", }
Custom dimensions and metrics
Any amount of custom dimensions or custom metrics could be added. Dimensions and metrics will be included in the product-related events payload. More specifically, dimensions are applied to the following events:
Measuring Product Impressions
Measuring Product Clicks
Measuring Views of Product Details
Measuring Additions or Removals from a Shopping Cart
Batching of products for impression event
You can select the amount of products to be batched under one impression event. Must be a number between 1-24.
Configuration
Initial configuration
To configure the extension:
In the admin panel navigate to Stores → Configuration → ScandiPWA → Google Tag Manager → General Configuration.
Enable the module and input your GTM ID. To obtain your GTM ID, visit https://tagmanager.google.com/, select your GTM account, then, copy the GTM ID from the top-right corner of the header.
Managing events
Available DataLayer push events can be enabled under the Stores → Configuration → ScandiPWA → Google Tag Manager → DataLayer Push Events Configuration. By default, all events are disabled.
Managing custom metrics and dimensions
The support for custom dimensions is added. They can be configured from Stores → Configuration → ScandiPWA → Google Tag Manager → Additional Configuration. There, you can add any amount of custom dimensions or custom metrics. The value of the dimension/metrics could be an attribute value of the parent or child product or a custom value.
It is important to name variables properly. For dimensions, the format is: “dimension<N>” where n is a natural number, for example, “dimension1”. For metrics, the format is “metric<N>” where n is a natural number, for example, “metric3”.
More information on custom metrics and dimensions could be found in the official guide:
Navigate to the Homepage. Open browser development tools. Switch to the network tab.
Filter results by name gtm.js
If the response status code is 200, the GTM is working. If not, then make sure that your GTM ID is correct and it has been published at least once with some tags.
Validating the data layer pushes
Use an extension that can show information about data layer pushes, for example, Adswerve - dataLayer Inspector+ for Google Chrome.
In the case of this extension, information about all pushes can be seen in the browser's console, for example, there should be a Google dataLayer.push(): event: general.
To see more information, click on the console message to show more information about the selected push.
Development
Implementation
Since version 2.0.0 (for ScandiPWA ^5.2.6, refer to README.md in older versions for development hints), the Extension does not utilize Redux anymore. Events can be dispatched from anywhere by calling functions defined in the src/event folder. The data for events is collected from the store outside of the components. The data collection logic is located in the src/data folder. The plugins that are responsible for event firing are located in the src/plugin/events folder. The mapping of events to their implementation folders are located in the src/util/events, in comments.
More Information
More Information
Product Name
Google Tag Manager (GTM)
Short Description
Google Tag Manager implementation for ScandiPWA, supporting Google Analytics Enhanced Ecommerce
Please note that the support for GA4 has been implemented exclusively for the following versions: 2.4.4-p2 Magento 6.1.1 SPWA, 2.4.5-p4 Magento 5.3.3 SPWA