Hey there, I'm Benjamin from
Loves Data. In this video, I'm going to show you how to set up ecommerce
tracking in GA4 (or Google Analytics 4) properties. The way you configure ecommerce
tracking will depend on how Google Analytics is implemented on your website. For example, if
you're using Google Tag Manager, then you can use a GA4 event tag to capture details from
the data layer. Or if you're using gtag.js, then you will need to modify the tracking
code. Let's jump in and look at these options! Before we get started, I want to mention
ecommerce tracking for hosted platforms and plugins. If you're using a hosted ecommerce
platform, like Shopify, or you're using a WordPress plugin for Google Analytics, you might
have to wait until they support ecommerce tracking for GA4 properties. For example, the built-in
Google Analytics integration available in Shopify doesn't currently support GA4 properties. In some
cases, you might be able to connect your existing standard (Universal Analytics) property to your
GA4 property to report on ecommerce transactions. If your platform or plugin adds the gtag.js
version of the tracking code to your website, then you can connect the two properties, so that
data automatically flows into your GA4 reports. Okay, we're going to start by looking at a custom
implementation, so let's head to my demo site... My demo website uses Google Tag Manager to track
transactions, pageviews, and other actions. So let's start by purchasing a product on my
demo site. I'm going to select a product... Add it to my shopping cart...
And make a purchase... We're now on the confirmation page,
so let's view the source code... We can see the custom data layer that includes
the details for our transaction. This is using the ecommerce schema for Universal Analytics
properties which is also compatible with GA4. The schema for GA4 properties is slightly
different. Since the current recommendation is still to run a GA4 property in parallel to
a Universal Analytics property, I recommend using the same schema that we can see here. So
the ecommerce schema for Universal Analytics. We can then configure Google Tag Manager to send
the details for each transaction to our Universal Analytics property and our GA4 property. If you're
only using a GA4 property, then you can continue to follow these steps, or you can implement a
custom data layer that uses the ecommerce schema for GA4. Just remember that the GA4 schema
isn't compatible with Universal Analytics. Okay, now let's head to Google Tag Manager... We
can see there is already a standard (Universal Analytics) tag, so start by having a quick
look at this tag. Let's select the tag... And the tag configuration... And let's
select the information icon next to the Google Analytics settings variable... This shows
us that all of the ecommerce transaction details are being automatically found in the data layer
and sent to Universal Analytics. So it's really easy to send transactions to Univeral Analytics.
Okay, let's close the variable... And the tag... We can also see there is a GA4 configuration
tag. This tag will automatically send pageviews to our GA4 property, but to send ecommerce
transactions requires custom configuration. To send ecommerce transactions we will need
to add a new tag. So let's create a new tag... Let's name the tag 'GA4 Ecommerce Transaction'... And let's select 'GA4 Event' as the tag
type... Now we can select our existing GA4 tag as the 'Configuration Tag'... And we're going
to enter 'purchase' as the event name... Now we need to select 'Event Parameters'... And we're going to enter 'items'...
This is the pre-defined parameter name used to report on the product people purchase
in GA4. Now we need to create a new variable... Let's name the variable 'Ecommerce Products'... And let's select 'Data Layer Variable' as the
type... For the 'data layer variable name' we need to enter 'ecommerce', 'dot', 'purchase', 'dot',
'products'... And then we can save the variable... Now we can repeat these steps to add the
other information from our transactions... We can add the transaction ID... And we're going to enter 'ecommerce', 'dot', 'purchase', 'dot',
'actionField', 'dot', 'id' for the variable... Affiliation... And we're going to enter 'ecommerce',
'dot', 'purchase', 'dot', 'actionField', 'dot', 'affiliation' for the variable... Revenue... And we're going to enter 'ecommerce', 'dot', 'purchase', 'dot', 'actionField',
'dot', 'revenue' for the variable... Tax... And we're going to enter 'ecommerce', 'dot', 'purchase', 'dot',
'actionField', 'dot', 'tax' for the variable... And shipping... And we're going to enter 'ecommerce', 'dot', 'purchase', 'dot', 'actionField',
'dot', 'shipping' for the variable... Now we need to create a trigger so that the tag
only fires when a purchase occurs on our website. So let's create a new trigger... Let's
name the trigger 'Ecommerce Purchase'... And let's select 'Custom
Event' as the trigger type... Now let's enter 'purchase' as the event
name... And let's select 'Some Custom Events'... Select 'Event'... And
'Equals'... And enter 'purchase'... This will mean our trigger only
fires when a purchase occurs. Now let's save the trigger...
And let's preview our changes... We can now complete another transaction... And we can check to see that the
tag has fired in Tag Assistant... We can select the purchase
event... And select the tag... We can then choose 'Values' to check that the
values have been sent to Google Analytics... And we can also head to Google
Analytics... And open the DebugView... This lets us check that the details are
being correctly passed to Google Analytics... So that's how we can use our existing data layer
to capture ecommerce details for our GA4 property! Okay, but what if we're not using Google Tag
Manager and we're using the gtag.js tracking code instead? Well, in this case, we need to modify
the tracking code when a transaction takes place. Let's head to the back-end of my course
platform to see how this works... Now we could of course use Google Tag Manager
and a custom data layer as we've already covered, but I also want to show you how to modify the
gtag.js tracking code to track transactions. So here we can add code to the page
people see after they've made a purchase. I've already added the standard gtag.js tracking
code... Now we can head to Google Developers... And grab the example ecommerce tracking
code... Now I can adjust the code... And enter the liquid markup variables that will
populate the transaction details into our code... The way you do this will depend
on the platform you're using, so I recommend checking out the
documentation for your platform and even contacting support for your platform to
get help setting up the tracking code correctly. I also want to highlight, that if you're using
a plugin, like Monster Insights for WordPress, then you'll need to continue using Universal
Analytics since it's not yet compatible with GA4. If the plugin you are using adds the
gtag.js tracking code, then you do have the option of using your existing Universal Analytics
property to send data to GA4. I've covered this briefly in another one of my GA4 videos and I've
included a link to it in the description below. So that's how you can track ecommerce transactions
into GA4 properties. Remember, the method you use to track transactions will depend on how
Google Analytics is implemented on your website. If you're using Google Tag Manager, then you
will also need to implement a data layer to make transaction details available to your tags.
And if you're already tracking transactions into a standard (Universal Analytics) property, then
you can adjust your implementation to also send the details to your GA4 property. Are you tracking
transactions into GA4? I'd love to know! Let me know in the comments below. And if you found this
video helpful please subscribe, share it with your friends, and hit the like button so I know to
make more videos like this. See you next time!
