My life with AMP – part 2

AMP + Google Analytics 4

I’ve talked about what is AMP and how to track AMP pages and send data into Universal Analytics here. But in this story I want to show you how to send data to Google Analytics 4. Since Google’s announcement that from July 1, 2023, standard Universal Analytics properties will no longer process data, this is a must-have.

Google search results on this topic are not very optimistic. I have found only one solution from David Vallejo, but without developer support this is not an option.

I’ve found another solution for one of our clients. We use Google Tag Manager for AMP to track users activity on AMP pages but the GTM AMP container doesn’t have a dedicated tag for GA4 (yet, I hope).

This is where I want you to meet Segment. Twilio Segment is a customer data platform (CDP) that helps you collect, clean, and activate your customer data.

Twilio Segment logo

So, let’s get started!

First, you will need a Segment Account. If your site does not have a lot of traffic, you can go with the free plan that includes: 1,000 visitors/month and 2 data sources.

Then, select your AMP Source and get the API Key provided.

You can follow the steps from here: or you can simply add Segment to your AMP pages with your GTM AMP container by selecting the Segment Tag Configuration and adding your AMP Source API Key.

After you publish your changes, you should see data flowing in your Segment Source (hit debugger and you can see live activity from your site).

The next thing you need to do is to add a destination. Go to Destinations and select Google Analytics 4 and you only need to add the measurement ID and a secret API Key that you generate from your GA4 Account.

The Segment App is very user friendly so you will find all the details here.

After you finish setting up the destination, you will have one more thing to do: mapping.

Google Analytics 4 is a cloud-mode destination, meaning that Segment collects data from the device, but it will forward the events from Segment servers to GA’s servers. For any events you wish to send to GA4, you’ll need to map these.

Select the GA4 destination, go to mappings and select (for example) Page View.

This is how a pageview trigger will look like:

You can add a test event (remember that you already have data flowing in your source). Segment will find an event that can be triggered by the event trigger you defined.

Next, you will need to define how data will be mapped from your source to your destination (ex: what variable gives the page title, page path, client ID etc.) and then you can start testing. To test this action, Segment will send the API request to Google Analytics 4 to track an event with the test event you added.

To finish testing you can do 2 more things:

  1. In Segment, go to your GA4 destination -> Event Delivery
  2. Go to your GA4 Property and check that you indeed are receiving data from your AMP pages. This is usually easy to check since your AMP pages have a different URL (something like ‘/amp/pagepath’ or ‘/pagepath?page=2’).

Here is an example for a specific page. We have views for the non-AMP version of the page (data sent with GTM + GA4) and for the AMP version for the same page (data sent with this implementation)

Good Luck!

Tags: Amp