Learning AMP: Adding GTM via AMP-Analytics — AMPire.city

Image for post
Image for post
Originally published at https://ampire.city

What Will I Learn?

Requirements:

Google Tag Manager for AMP-Analytics Code Example

<!-- AMP Analytics --><script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>
<!-- Google Tag Manager -->
<amp-analytics config="https://www.googletagmanager.com/amp.json?id=GTM-XXXXXXX&gtm.url=SOURCE_URL" data-credentials="include"></amp-analytics>

Installing Google Tag Manager on AMP Website

1. Creating AMP Account on GTM

Image for post
Image for post
AMP Google tag Manager code would work on both AMP and non-AMP websites.

2. Getting AMP-Analytics & GTM Code

Image for post
Image for post
Google Tag Manager code for AMP website is identical except for GTM ID.
<!-- Google Tag Manager -->
<amp-analytics config="https://www.googletagmanager.com/amp.json?id=GTM-XXXXXXX&gtm.url=SOURCE_URL" data-credentials="include"></amp-analytics>

Requirements for AMP Google Tag Manager

<!-- AMP Analytics --><script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>

3. Adding AMP-Analytics & GTM Code to AMP Website

4. Testing GTM on AMP Website

Image for post
Image for post
You can find the actual website’s code on Elements tab.

Getting Google Tag Manager to Work on AMP Website

Travel Blogger, Web Designer & AMP Developer | Travel & History Journal: https://www.ctdots.eu | AMP Development & Web Design Tutorials: https://ampire.city

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store