With the introduction of GA4, a lot has changed in the field of website analytics. The biggest difference, of course, is that GA4 is event driven and not session driven but event driven. The main reason for this change is that it is becoming increasingly difficult for Google to get a complete data picture of the user. For example, the fact that iOS blocks 3rd party tracking makes it harder to send the right data to your analytics platform. Also, make use of adblockers is still rising, for example.
Practice
In this article, I want to go deeper into our standard GA4 and GTM configuration. We use the following extensions for this purpose:
- Yireo GoogleTagManager - https://github.com/yireo/Yireo_GoogleTagManager2
- Elgentos Server side analytics - https://github.com/elgentos/magento2-serversideanalytics
Of course, both extensions are free to download from github.
In addition, it is important to have a server side container of GTM installed. I will not elaborate on this in this article, this is also normally beyond our scope, but here we can help. A server side container is important because you can ensure that gtm.js is downloaded from your own domain. The "initiator" of sending data is then within your own domain. The data can then also be sent to your own domain. For this, you create for example the CNAME marketing.JEDOMEINNAAM.com. All data is now 1st party and you have also fixed iOS tracking. More information can be found here: https://developers.google.com/tag-platform/tag-manager/server-side
The Yireo GTM extension creates events in the datalayer. You can fire these in your GTM configuration. By default, these events are:
- view_item
- view_item_list
- select_item
- add_to_cart
- remove_from_cart
- view_cart
- start_checkout
- add_payment_info
- add_shipping_info
- purchase
These events must all be created in GTM and forwarded to GA4 and/or other endpoints.
Often our customers need customization on this. For example, if we want to track a reorder flow from the homepage or account page.
Our ambition is that at least the purchase data is 100% correct in Google Analytics. For GA1 & UA we had already created a serverside extension that sends the purchase event serverside to GA when the order was paid.
For GA4, this was of course the intention again. In this version we have also taken headless projects into account. The most important thing is to store a GA userID and a GA sessionId as soon as possible. We used the following flow:
- User visits the site and adds an item to the cart
- Currently, the extension looks to see if a user_id and/or session_id is present
- These are stored in a separate table with a quote_id reference
- When the order is placed, the table is updated with the order_id
- When the order is paid, it is sent to GA4 with the measurement protocol
We have built a feature that ensures that if there is no session_id present, due to use of an adblocker for example then it will be filled with a fallback session_id. This can be a range or a default id.
Future
Currently, in server side analytics, we are only bottoming the purchase event. I could well imagine expanding this as the use case arises.