Google analytics 4

Google Analytics 4 is a new kind of Google Analytics, with different reports than what you're used to seeing in Universal Analytics properties.  One advantage of a Google Analytics 4 property is that you can use it for a website, an app, or both a website and an app together. Universal Analytics properties only support websites. You can read the announcement from Google to learn more.


What's covered in this article:


Client Side Tracking 

In client-side tracking, the tracking code is processed by the user's web browser. So, when someone visits a website, the tracking code runs on their browser and sends information about their activity back to Google. This means that the tracking is done on the user's end.

Note: Client-side tracking can be affected by ad blockers and browser settings.

 

Setting up Google Analytics 4

If you already have an active GA4 account, skip to GA4 Conversion Tracking Setup.

Visit this link to sign up for a Google Analytics account

 

Create a new Property

  1. In Admin, look at the Account column to ensure you've selected the right account.
  2. Then, in the Property column, click Create Property.
  3. Enter a name for the property and select the reporting time zone and currency.
    • If a visitor comes to your website on a Tuesday in their time zone, but it's Monday in your time zone, the visit is recorded as having occurred on Monday.
    • If you choose a time zone that honors Daylight Savings Time, Analytics automatically adjusts for time changes. Use Greenwich Mean Time if you don't want to adjust for Daylight Savings Time.
  4. Click Next. Select your industry category and business size.
  5. Click Next. Select how you intend to use Google Analytics.
  6. Click Create and (if you are setting up a new account) accept the Analytics Terms of Service and the Data Processing Amendment.
  7. Continue to Add a data stream to start collecting data.

 

Creating a Data Stream

If you are installing any Google Analytics for the first time, you’ll be prompted to create a new data stream based on if it is a web or an app.

  1. Select Add Streams > Web
    Screen Shot 2024-02-07 at 12.06.38 PM.png
  2. Then, you’ll be prompted to enter details – like your website URL – to set up the new data stream.Screen_Shot_2021-10-04_at_9.25.34_AM.png
  3. According to Analytics Help: You can enable or disable enhanced measurement.
  4. Once the Data Stream is created the Measurement ID is what will be used to identify the stream.seller stream URL:ID.png

 

Google Analytics 4 Conversion Tracking Setup

The steps below will help the seller navigate the Google Analytics 4 account to find the Measurement ID and GA4 Script, and configure cross-domain tracking.

  1. Select Property > AdminSelect Property.png
  2. Once you are in the Admin tab under Property select Data Streams and select proper stream to prompt configuration settings.Add Stream.png
  3. Within the Data Stream select Configure Tag Settings > Configure your domains > Match Type Contains > include checkout.xola.app, checkout.xola.com and your website URL
     

    CONFIGURE TAG SETTINGS.png

    configure your domains.png

    MATCH TYPE CONTAINS.png

  4. Once you have the domains configured we can start implementing the tracking script on the website. The gtag.js script can be found by selecting ‘View tag instructions’ within the Stream details.453b7d7d-03db-4696-9fea-c5c2f99729f4.png
  5. This is the gtag.js script that needs to be pasted within your website code before the end </head> tag.b7609d00-c2f9-4c18-88ec-4a0af78de27d.png
 
 

Google Tag Manager Ecommerce Purchase Events

To configure Google Analytics 4 tag in your Google Tag Manager container please read this article provided by Google for proper steps. 

If gtags are managed via Google Tag Manager follow the steps below to configure Ecommerce purchase events. It is important to note that if this is not configured in the GTM container the seller may experience a drop in conversions made on desktop.

  • Go to the Google Tag Manager page, click on tags, and click on ‘New’.GTM step1.png
  • When choosing the type of tag, select “Google Analytics”, then “Google Analytics: GA4 Event”Screen Shot 2024-02-07 at 2.20.50 PM.pngScreen Shot 2024-02-07 at 2.01.29 PM.png
  • Add your GA4 measurement ID to the event, set the event name as {{Event}} and check the “Send Ecommerce data” checkbox:
     
    event.png
     
  • Add a trigger for this event. ON Trigger selection panel, click on “+”,        sttep4.png
  • Select “custom event”:Screen Shot 2024-02-07 at 2.24.04 PM.png
  • Add “view_item|view_item_list|add_to_cart|add_payment_info|purchase” as the event name and check “regex matching” checkbox:addtocart parameters.png
  • Save and publish your container, and you should be ready to go!

Configure GTM Container ID in your Xola account

If you have multiple tags firing in your Google Tag Manager we recommend configuring your GTM Container ID within your Xola account. Naturally, desktop will load the GTM container in checkout, while mobile will load the gtag. By configuring the GTM container ID in Xola it allows for a more complicated setup to capture higher conversions/events by loading the container in checkout for both mobile and desktop. To configure the GTM container ID navigate to Marketings > Conversion Tracking > Google.

Screen Shot 2024-03-29 at 11.55.25 AM.pngManager we recommend configuring your GTM Container ID within your Xola account. Naturally, desktop will load the GTM container in checkout, while mobile will load the gtag. By configuring the GTM container ID in Xola it allows for a more complicated setup to capture higher conversions/events by loading the container in checkout for both mobile and desktop. To configure the GTM container ID navigate to Marketings > Conversion Tracking > Google.

 

Optimize Your Integration

Follow these steps to ensure a seamless connection between your website and Google Analytics 4 via Xola.


Preliminary Step: Install the Xola Checkout Javascript

  • Locate the Javascript Code: Find the Xola Checkout Javascript code within your Xola account by navigating to Settings > Button Code and locating Step 1.
  • Implement the Code: Insert the Javascript code as close to the top of the <head> section of your website as possible. This positioning ensures that the script loads promptly when visitors arrive at your site, facilitating accurate tracking from the outset.

Button Code Installation and Analytics Integration

To ensure accurate tracking and integration with Google Analytics, follow these consolidated guidelines:

  • Direct Installation: Embed Xola’s button codes directly into your website’s HTML code. Avoid using plugins that create iframes within website builders, as this method may fail to capture conversions.
  • Analytics Integration Setup: The Google Analytics integration must occur within the checkout iframe for accurate tracking. Ensure the checkout button on your site either opens in a pop-up or is directly embedded. Avoid buttons that redirect to a xola.checkout.com URL, as these will not track conversions.
  • Resource for Proper Installation: For a comprehensive guide on correctly installing Xola buttons, check out this article.

Optimize Your Tag Management

Minimize gtag.js Scripts: If Google Tag Manager is being used to handle your tags, ensure only necessary scripts are present. Reducing the number of gtag.js scripts helps prevent potential conflicts and streamlines page loading times.

Update Analytics Scripts

Remove Outdated Scripts: Eliminate any scripts associated with Universal Analytics to avoid discrepancies in revenue or conversion data. Keeping your site updated with only the necessary scripts ensures accurate data collection.

Leverage Custom Conversion Tracking

Google Ads Conversions: To track conversions from Google Ads effectively, utilize the Custom Conversion Tracking feature found under the Marketing tab in your Xola dashboard.

Was this article helpful?
0 out of 0 found this helpful