AMP & Tag Manager setup guide
Last updated
Was this helpful?
Last updated
Was this helpful?
The (AMP) is an open-source web platform that helps to improve the performance of your web content. AMP includes built-in support for Google Tag Manager. This document describes the recommended way to set up Google Tag Manager on AMP pages.
To install Tag Manager for AMP:
an AMP container in Tag Manager.
the Tag Manager snippet to your AMP pages.
tags in your Tag Manager container and publish.
Tag Manager features an AMP container type. Create a new AMP container for your project:
On the screen, click More Actions () for the account you'd like to use. Select Create Container.
Name the container. Use a descriptive name, e.g. "example.com - news - AMP".
Under Where to Use Container, select AMP.
Click Create.
Your container is now ready. The next step is to install the Tag Manager code on your AMP pages.
Tag Manager will provide information on how to best install the code snippet, and you can refer to the for further guidance.
After you create your new AMP container, the Install Google Tag Manager screen will appear. Tag Manager provides two code snippets. Copy these code snippets so that they appear on your AMP pages.
Note: To access the code snippets later, click the container ID number at the top of your workspace overview page, or click Admin and then Install Google Tag Manager.
The first snippet adds the amp-analytics component to your AMP page. This code is placed at the end of your page's <head> section, and should only appear once on the page.
<!-- AMP Analytics --><script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>
Important: Only add this code to your page if it does not already exist, and ensure it only appears once per page.
The second snippet configures amp-analytics to use Tag Manager. Place this code immediately after the opening <body> element. Replace GTM-CONTAINER_ID with your Tag Manager's container ID, or copy and paste the entire snippet from the Tag Manager user interface.
<!-- Google Tag Manager --> <amp-analytics config="https://www.googletagmanager.com/amp.json?id=GTM-CONTAINER_ID" data-credentials="include"></amp-analytics>
When your pages have the container snippet correctly installed, they will be able to fire tags deployed from Tag Manager. The next step is to create tag configurations and publish the container.
To create a new tag:
Click Tags New.
Configure the tag with information provided by your tag vendor.
Click Triggering and add one or more event conditions that will cause the tag to fire.
Name the trigger and click Save.
Tag Manager can capture AMP variables and use them in tag and trigger configurations. For instance, a page that sells shoes might have variables that describe the properties of a particular shoe. These values can be used to create Tag Manager variables:
<amp-analytics config="https://www.googletagmanager.com/amp.json?id=Tag Manager-XXXXXX;Tag Manager.url=SOURCE_URL" data-credentials="include"> <script type="application/json "> { "vars" : { "type": "shoes", "color": "red" } } </script> </amp-analytics>
To create a user-defined variable in Tag Manager that captures the color variable from the above code:
Click Variables.
Under User-Defined Variables, click New.
Click Variable Configuration and select AMP Variable.
In the Amp Variable Name field, enter the field name (e.g. "color".)
Give the variable a descriptive name (e.g. "AMP Variable - color".)
Click Save.
Was this helpful?
How can we improve it?
Click Tag Configuration and select the tag type from the list of .
Repeat these steps for any additional tag configurations. When your container configuration is ready, for the changes to take effect.