DEV Community

loading...
Cover image for How to setup Google Analytics 4 on Shopify without an app
Analyzify

How to setup Google Analytics 4 on Shopify without an app

Erman Küplü
A digital marketing veteran with 10+ years of experience, Upwork enthusiastic with 200+ projects completed.
Updated on ・4 min read

Google Analytics 4 is the new default option for Google Analytics. The analytics community has been waiting for this version for a long time. However, as with every new product, it has some internal and external problems.

I will start with a quick intro - but feel free to jump into the steps below if you want to go to act immediately!

Update (23.03.2021) This tutorial explains how you can add GA4 into Shopify directly. We have made a new - free Shopify - GTM video course series on Youtube where we explain how you can set up GA4 (and more) using Google Tag Manager. Check out the video series if you want to further expand your data-analytics setup.

GA4 is using a different approach to data collection compared to Universal Analytics (UA), the old version. UA's core function was page views and events would come on top of that. We would use event tracking for specific actions such as form submission, registers, video interaction, button clicks, and so on. In GA4, even a page view is an event! It might not sound like revolutionary change but it actually is. We plan to write another in-depth post on the main differences between GA4 and UA.

One of the core problems of GA4 is the integrations. The platforms (such as Shopify, Squarespace, Weebly, and so on) are not ready for Google Analytics 4 yet. While GA4 has great features for e-commerce stores; it is very hard to implement it at the moment - especially the ecommerce features. And you can already imagine it makes no sense to use Google Analytics 4 without the sales data for a Shopify (or any kind of) store. There are several apps in the Shopify App store that helps with the setup. However, there was no free, working solution or tutorial as of last week. The tutorials and articles didn't include a way to track e-commerce data.

That's where we came up with the idea of making a free tool that will allow people to set up Google Analytics 4 on Shopify stores - and also send the e-commerce data.

I wanted to create content also on dev.to for this wonderful community. I have also created a video tutorial in case you prefer a video version. Let's get started.

Should you use GA4 and how?

Google suggests using the old one (UA) and the new one (GA4) together. While you start collecting data and taking advantage of GA4, you still have the UA's known interface and advantages. A quick guide to how to do that:

For the new accounts:

You will see Google Analytics 4 as a default option if you want to create an account now. However, there is an Advanced Setting that allows you to create both GA4 and Universal Analytics. Go to the "Create Google Analytics Account" screen and find the "Advanced" setting - kindly check the GIF below:
Creating Google Analytics 4 and UA accounts together

For the existing accounts:

Upgrade your current account. It won't make you lose any data, don't worry about it. It is actually not "an upgrade"; it will just create a new GA4 account attached to your existing UA account.
Upgrading your current account
After you do this, you will find your new GA4 account; under your properties at the top menu.

Step 1: Get the GA4 Global Tag

As you have the account now, it is time to get the new global tag and insert it into your Shopify store.
Find your new GA account in your Google Analytics, and then > Click Admin > Data Streams > Click the Tag > And then find Global Tag and copy the full code
Copy GA4 Global Tag

Step 2: Insert the tag into Shopify's main theme file

The global tag should be on every page. You should insert that into the Shopify theme's main file: theme.liquid - right below

.
Shopify Admin > (left bar) Online Store > Themes > Actions (near your active theme) > Edit Code --- And then find theme.liquid. It should look like this >
Adding GA4 tag into Shopify theme

Step 3: Get your checkout tag from Analyzify GA4 Wizard

Everything was standard until now. Now we have come to the existing part. Our team has prepared a special code block to be inserted and rendered in your Checkout/thank you page. It includes Shopify's shortcode for order confirmation details such as order ID, revenue, etc - and also GA4's Purchase Event tag including your measurement ID.
Go to our free tool > Analyzify GA4 Wizard for Shopify, fill the simple form, and get your code. It should look like this >
Analyzify Google Analytics 4 Shopify Wizard Copy the code and move to the next step.

Step 4: Paste the code into Shopify's Checkout screen

As this is an e-commerce purchase code, it should be rendered when someone makes a purchase. Shopify allows us to add additional scripts into "Order Processing" and "Thank you" pages. Go to Shopify Admin > Settings > General > Checkout and then find Order Processing > Additional Scripts - and paste it there.

Step 5: Verify - Make Sure!

All good! It should be working perfectly now if you followed the steps properly. You can wait for some purchases to happen in your online store so that you can check if data flows into your new GA4 account. You can also follow this video tutorial to make a test purchase and see if the related events are being triggered and shown in Google Analytics 4.

I hope you find it useful and feel free to let us know if you have any questions or face any issues.

Discussion (8)

Collapse
protekteknoloji profile image
PROTEK Teknoloji

Great app, will definitely try it. And thanks for the tutorial 👍

Collapse
ekuplu profile image
Erman Küplü Author

Thank you! And let me know if you have any problems.

Collapse
omercan profile image
Omercan Celikler

Is it only working on the purchase event?

Collapse
ekuplu profile image
Erman Küplü Author

Purchase + Page views.

Collapse
dengalich profile image
Den Galich

Erman! Thanks for the solution! Is it possible to push purchase items along with the purchase event?

Collapse
ekuplu profile image
Erman Küplü Author

Hello, Den!

It is definitely possible. It is a little more complex and needs the product items to be added into the checkout dataLayer in this format developers.google.com/tag-manager/...

It is challenging because there will be multiple items and you will need to loop them in the checkout code.

In Analyzify, we are using global dataLayers, Google Tag Manager, and passing everything GTM. You can check out our product apps.shopify.com/analyzify

Have you seen the course we just published - youtube.com/playlist?list=PL92pEp_...? In that course, we are adding GA4 and everything through GTM with dataLayers. The products are still not included in the course but you can add new dataLayer elements and adjust yourself if you are a little familiar. Especially after watching the course.

I hope I could help!

Collapse
amkniss profile image
amkniss

Thanks so much! Great article. W

Collapse
ekuplu profile image
Erman Küplü Author

Thanks for your nice words. Checkout our Youtube Channel (youtube.com/channel/UCSa3aE3zQmSRA...) as well. A brand new Google Analytics 4 Course is on its way!