AMP pages are served from an AMP cache domain which is different from your site domain. To track a user journey across an AMP cache and your site pages, you can use an AMP Linker; an amp-analytics feature that joins user sessions using AMP Client ID as a user identifier.
AMP Linkers decorate outbound links from AMP cache pages with an AMP Client ID. Pages tagged with Google Analytics then retrieve the AMP Client ID from the URL query parameter and join the user session using the AMP Client ID as user identifier.
This article describes the steps needed to set up an AMP Linker with Google Analytics.
How the AMP Client ID affects your data
Synchronization of AMP Client IDs between an AMP Cache and your original site domain results in more accurate user metrics, e.g. Session Duration, Bounce Rate, and Pages per Session. Note that for the AMP Client ID to be useful, data should be collected within the same Google Analytics property.
Set up the AMP Linker
You will set up the AMP Linker with Google Analytics in three steps:
Step 1. Tag your AMP pages to pass AMP Linker parameters
Install a Google Analytics tag, either via the Google tag (gtag.js) or via Google Tag Manager. Follow instructions below based on your implementation:
Option 1: Google tag
Add the default Google tag for AMP on your AMP landing pages. See example snippet below and make the following changes:
Replace MEASUREMENT_ID with the tracking ID of the Google Analytics property to which you want to send data
Optionally, if your AMP pages are hosted on a different top-level domain from outgoing links to your site or if AMP pages are not on a well-known subdomain (ie. not on , amp., m.), include a linker configuration as shown below. Add in the domain that the AMP page is hosted on as well as domains for any outgoing links.
<script type="application/json">
{
"vars": {
"gtag_id": "MEASUREMENT_ID",
"linker": {
"domains": ["example.com", "example2.com"]
}
,
"config": {
"MEASUREMENT_ID": {
"groups": "default"
}
}
}
}
</script>
</amp-analytics>
gtag_id, you can specify the ID from any Google product (e.g. Google Ads or Search Ads 360) that you're using on your AMP, but only use an ID from one Google product in the gtag_id field.Option 2: Google Tag Manager
Create an AMP container in Google Tag Manager.
Add a Google Analytics tag to your AMP Container.
Add a Conversion Linker tag to your AMP Container and select ‘Enable Linking across domains’ and ‘Enable linking to Google Analytics Client ID’. If your AMP landing pages are hosted on the same top-level domain as outgoing links to your site, you can leave the domains field empty.
Optionally, if your AMP pages are hosted on a different top-level domain from outgoing links to your site or if AMP pages are not on a well-known subdomain (ie. not on , amp., m.), add the top-level domain your AMP page is hosted on as well as domains for any outgoing links as a comma delimited list.
Use the default Tag Manager code snippet on your AMP page - See the example below and replace GTM_CONTAINER_ID with your Tag Manager container id.
<!-- Google Tag Manager →
<amp-analytics config="https://googletagmanager.com/amp.json?id=< GTM_CONTAINER_ID>>m.url=SOURCE_URL" data-credentials="include">
</amp-analytics>
Step 2. Tag your non-AMP pages to read AMP Linker parameters
There are several ways to tag your non-AMP pages to read AMP Linker parameters, so use the instructions that are most appropriate for your configuration.
Option 1: Google tag
Include the gtag.js snippet on your non-AMP pages. See example snippet below:
- Replace
MEASUREMENT_IDwith the tracking ID of the Google Analytics property to which you want to send data - Optionally, if your AMP pages are hosted on different top-level domain from outgoing links to your site or if AMP pages are not on a well-known subdomain (ie. not on , amp., m., include a linker config as shown below. Add in the domain that your AMP page is hosted on, as well as domains for any outgoing links.
<script async src="https://googletagmanager.com/gtag/js?id=MEASUREMENT_ID"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('set', 'linker', {
'domains': ['example.com', 'example2.com']
});
gtag('js', new Date());
gtag('config', 'MEASUREMENT_ID');
</script>
Option 2: Google Tag Manager
For the GTM Web Container, make sure the Google Analytics tag has been added.
If your AMP pages are hosted on different top-level domain from outgoing links to your site or if AMP pages are not on a well-known subdomain (ie. not on , amp., m.), add in the following configuration: In the Google Analytics tag, add a field ‘allowLinker’ with value true using steps below:
- Open the Google Analytics Settings variable you want to edit, then click the Variable Configuration card.
- Navigate to More Settings > Fields to Set.
- Click + ADD FIELD.
- Set the Field Name to allowLinker, and set Value to true.
- Save the new variable configuration.
- Repeat the previous steps for all relevant Google Analytics Settings variables (if you are using more than one variable in your container).
- Publish the container.
Use the default Tag Manager code on your non-AMP pages.
Option 3: analytics.js
For your non-AMP pages, you can use the default Analytics js code snippet to read AMP linker parameters.
<!-- Google Analytics -->
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://google-analytics.com/analytics.js','ga');
ga('create', 'GA_TRACKING_ID', 'auto');
ga('send', 'pageview');
</script>
<!-- End Google Analytics -->
Optionally, if your AMP pages are hosted on a different top-level domain from outgoing links to your site or if AMP pages are not on a well-known subdomain (ie. not on , amp., m.), add in the configuration highlighted below, as described in cross-domain configuration for analytics.js:
<!-- Google Analytics -->
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://google-analytics.com/analytics.js','ga');
ga('create', 'GA_TRACKING_ID', 'auto', {'allowLinker': true});
ga('require', 'linker');
ga('linker:autoLink', ['subdomain1.example.com', 'subdomain2.example.com','example2.com'] );
ga('send', 'pageview');
</script>
<!-- End Google Analytics -->
Step 3. Add a referral exclusion to the Google Analytics admin console
When Google serves AMP content to users, it uses the Google AMP Cache. To prevent cached AMP subdomains from breaking sessions, you must add a referral exclusion for the domain cdn.ampproject.org.
subdomain.example.com, then add a referral exclusion for subdomain-example-com.cdn.ampproject.org. Learn more about AMP Cache URL format.Setup verification
Verify that the Google AMP Client ID matches between AMP and non-AMP pages.
Option 1: Verify via the AMP Tag Test tool
Use the AMP Tag Test tool and enter AMP URL to test.
Note: The AMP Tag test tool is an automated testing tool that simulates a flow from AMP page served via viewer to a link to the next page. This tool should be used as a guideline and may not capture all test scenarios (e.g if the AMP page has links to different domains or subdomains). Please use the options below for manual testing options.
Option 2: Verify via the Google Tag Assistant Chrome Extension
- Download and install the Google Tag Assistant Chrome extension
- Enter a search query on google.com that will return an AMP page for your site.
- Start Tag Assistant Recordings.
- Refresh the search results in browser after recording has started.
- Click the search result that leads to your AMP page.
- Click a link that leads from the AMP page to a non-AMP page.
- Stop Tag Assistant Recordings.
- Make sure there is only one session with consistent IDs as seen below (i.e Page Load 2 does not show Session Start.)
Option 3: Verify via Chrome Developer Tools
- Open the Google Chrome browser in incognito mode. Enable the mobile emulator in Chrome Developer Tools.
- Enter a search query on google.com that will return an AMP page for your site and click a search result for your AMP page, which should be served via the Google AMP Cache and displayed within the Google Search AMP viewer.
- Note: If your page is not yet available via Google Search results, you can still test to see if session unification is working by going to the AMP Test tool to preview Search Results and following the steps mentioned below as long as the page can be indexed by Google.
- Find the Google Analytics network request for the AMP pageview: Go to the Network tab in Chrome Developer Tools and enter "collect" in the Filter field.
- Locate and select the network request that goes to
google-analytics.com. On the Headers tab for the request, find the client ID by scrolling to Query String Parameters. Note the cid parameter. - When AMP page is served by AMP viewer, the
cidformat should be a 64 characters long base64 string: - Click Clear to clear the network requests.
- To verify that you have opted-in your non-AMP pages, confirm that the same cid parameter persists when navigating to a non-AMP page. To do this, click any link on your AMP page that goes to a non-AMP page served from your domain. To find the client ID, again filter for the string "collect". Select any network request that goes to
google-analytics.com. Check that the cid query-parameter value matches the value you noted from Step 5.
Limitations
- Session unification via AMP linker will not happen if a first-time user closes out the AMP page without navigating to next page since the session unification works using link decoration.
