This guide shows you how to track:
How to setup Google Tag Manager Tracking in WordPress
- Create Google Account or Login to your existing Google Account
- Sign into Google Tag Manager
- Create a new Google Tag Manager Account (e.g. Penguin Initiatives)
- Create a new Google Tag Manager Container for your website (e.g. penguininitiatives.com)
- Copy your new Google Tag Manager Container’s GTM ID (e.g. GTM-P3XHZF):
- Login to your WordPress website’s Admin Dashboard and go to Plugins > Add New
- Search for “DuracellTomi”, click the “Install Now” button for “DuracellTomi’s Google Tag Manager for WordPress” and then activate the plugin
- Go to Settings > Google Tag Manager
- Paste in your Google Tag Manager ID and click the “Save Changes” button
- Right click and save this Google Tag Manager Container Template for WordPress
- In your Google Tag Manager account click on the “Admin” section
- Select your new Google Tag Manager Account and Container
- Click on “Import Container”
- Then select the Google Tag Manager Container Template for WordPress JSON file you downloaded and import it
- Now replace “yourdomain.com” with your website’s domain in the following Triggers: Anchor Link Click, External Link Click and Internal Link Click (you may have to refresh your container to see the newly imported Tags, Triggers and Variables)
- Next replace “affiliatelinkpattern” with whatever URL pattern is consistent for your affiliate links, if your site doesn’t have affiliate links or they don’t use a consistent URL pattern you can skip this step
- Finally replace the “Tracking ID” Variable with your website’s Google Universal Analytics Tracking ID (e.g. UA-61808155-1)
- Save all your changes and Publish your Container
- Login to your WordPress website’s Admin Dashboard and go to Plugins > Add New
- Search for “WP Ajaxify Comments”, click the “Install Now” button for “WP Ajaxify Comments” and then activate the plugin
- Go to Settings > WP Ajaxify Comments
- Check the checkbox next to “Enable plugin”
- Scroll down to the ‘OnAfterUpdateComments’ callback field”, then copy & paste in the following JavaScript code:
- Scroll to the bottom and click the “Save Changes” button
- If you would like to track Contact Form Submissions, simply use the Contact Form 7 WordPress Plugin to power your contact form
- If you use Elegant Theme’s Bloom Email Opt-In WordPress Plugin and want to track new Opt-Ins you’ll need to do the following:
- Download Bloom’s custom.js file from this location: /wp-content/plugins/bloom/js/custom.js and open the file in a text editor
- Search for the following code (on line 405 in version 1.0.3):
- Hit return after this line of code to create an empty line below it, then copy and paste the following code:
- Now save your modified custom.js file and overwrite it via FTP
- If you use Elegant Theme’s Monarch Social Sharing WordPress Plugin and want to track social follows, media shares and social shares you’ll need to do the following:
- Download Monarch’s custom.js file from this location: /wp-content/plugins/monarch/js/custom.js and open the file in a text editor
- Search for the following code (on line 11 in version 1.2.2):
- Hit return after this line of code to create an empty line below it, then copy and paste the following code:
- Search for the following code (on line 35 in version 1.2.2):
- Hit return after this line of code to create an empty line below it, then copy and paste the following code:
- Now save your modified custom.js file and overwrite it via FTP
- Finally clear your cache and purge your CDN if needed, if you followed this guide correctly you should see the following in your Google Analytics > Real-Time > Events Report:
- For slicing and dicing this data further I’ve also created this Google Analytics Advanced Segments Template you can import into your Google Analytics account
Add Google’s Tag Manager Container Code Without a Plugin
If you don’t want to use a plugin to add your Google Tag Manager code to your WordPress website, then you can of course alternatively copy and paste the code snippet right below your opening body tag in your WordPress theme’s header.php file if you know how to do so. Note that if you do this instead you won’t get the WordPress dataLayer variables that DuracellTomi’s Google Tag Manager for WordPress plugin creates
dataLayer.push({'event' : 'newComment'});
set_cookie( 365, 'et_bloom_subscribed_to_' + optin_id + list_id + '=true' );dataLayer.push({'event' : 'newSubscriber', bloomOptin : this_button.data( 'optin_id' ) });share_link = 'media' == social_type ? $this_el.data( 'social_link' ) : $this_el.prop( 'href' );( media_url ) ? dataLayer.push({'event' : 'mediaShare', shareNetwork : $this_el.data( 'social_name' ), shareMedia : 'media' == social_type ? $this_el.closest( '.et_social_media_wrapper' ).find( 'img' ).attr( 'src' ) : '' }) : dataLayer.push({'event' : 'socialShare', shareNetwork : $this_el.data( 'social_name' )});post_id = $this_el.data( 'post_id' );dataLayer.push({'event' : 'socialFollow', followNetwork : $this_el.data( 'social_name' )});
Additional Google Tag Manager Resources
A nice high-level overview of Google Tag Manager on Search Engine Journal.
Google’s official help website for Google Tag Manager.
A very useful Chrome Extension that shows which tags are present and allows you to view events and variables that are available in the dataLayer. It is immensely helpful when you are testing and/or debugging.
Simo is essentially THE Google Tag Manager guru and has written an incredible amount of advanced guides, tips and other helpful resources on Google Tag Manager worth checking out.
Want to track something else?
If you want to track something not covered here and need help getting it to work, please post a request in the comments and I’ll do my best to help you out.
This is great! Thank so much for your help, this is exactly what I was looking for. :)
Jignesh,
That’s great to hear!
Did you have any trouble implementing anything and/or is there anything else you wanted to track that I could help with?
Awesome tutorial!
I was wondering what do these do across the json file?
“accountId”: “71556451”,
“containerId”: “1193060”,
Those are just ignored upon import.
Thanks for this tutorial. We are working with GTM and this was very helpfull!
Regards,
Nicolas
Hello Andy,
You should make video lessons. I would buy them! Thanks for this, we are definitly trying it out.
We are still starting so this is very helfull!
Maybe one day I will, happy to hear this post helped you out =P
This is a useful find, thank you.
What does the plug-in, “WP Ajaxify Comments” do? Do we need to add/us this?
I’m thinking I can skip this step on down if we’re looking to start out with tracking External/Internal/Anchor links and 404. Correct?
TIA,
Erica
You’re welcome!
That plugin allows you to track only comment submissions that pass validation as events and prevent comment submissions that fail validation from being logged as comment submission events. That way you only get comment submissions logged as events when comments were truly processed and submitted to your WordPress website, making the accuracy of your event tracking for comments significantly better. I hope that makes sense.
Yes you can skip that step if you don’t care about less accurate comment submission tracking. If you skip that step you will still track a comment submission as a custom event, it will just be every time someone clicks the comment button regardless of whether or not they see an error afterwards.
I like that plugin more so because it provides a better user experience for visitors and increases the likelihood that visitors will ultimately leave a comment. AJAX validation on any form is almost always preferable to the alternative.
Cheers,
Andy
this is very useful. youre the best bro
thanks verymuch
Ohh thank you so so much this is just what I was looking for 😀
I do have a question – I would like to gather author information to be able to let’s say track how many page views each author gets. Do you know how I could acheive this?
Again thanks again.
Happy to hear that =)
You could try following this guide https://searchenginewatch.com/sew/how-to/2354243/publisher-guide-for-adding-custom-variables-in-google-tag-manager and use this plugin to get author information in the dataLayer more easily https://wordpress.org/plugins/duracelltomi-google-tag-manager/
Then you could segment pageviews by an author Google Analytics custom variable.
Hello, thank you very much for your work and your explanations! I have several CTA forms with contact form 7 on the site but I don’t know which one is activated. I can see the events in real time but how do I get my form id back when someone clicks on the submit button? Thank you in advance !