Toolonomy Logo

Google Tag Manager Installation on WordPress (Step-by-Step)

Authored by: Mohammed Wasim Akram
Last Updated on: March 21, 2022

If you're looking for a way to install Google Tag Manager on your WordPress site using one of our favorite plugins Advanced Scripts, then stop scratching your head and just follow this tutorial to get it done within a few minutes.

This method of installing Google Tag Manager is applicable for both Oxygen Builder users or any of the other themes users. Please go through the tutorial and you would understand how to implement this for any of the scenarios.

However, this job could also be done using any available free plugins in the WordPress Repository. But I hate installing plugins for these kinds of small things though I would consider using Google Tag Manager for WordPress plugin over Advanced Scripts when I use Woocommerce on the sites.

Advanced Scripts is a very unique plugin with a lot of potentials especially when you don't want to mess with backend code for injecting small snippets as it will also help you manage all your snippets in one place.

You can also use the free Code Snippets plugin to inject and manage snippets but this tutorial is dedicated to teaching you the way of adding Google Tag Manager using the Advanced Scripts plugin.

However, at this moment Advanced Scripts (being a paid plugin) is far superior to Code Snippets (a free plugin) in all aspects in my opinion, and I recently migrated all my snippets from CS to AS and I'm completely satisfied.

Now I would like to give a shout-out to Abdelouahed Errouaguy for helping me to learn how to add the GTM Tag using Advanced Scripts, who is also the man behind this and other powerful plugins like Hydrogen Pack and Oxygen Attributes.

Also if you want to learn more about the Advanced Scripts, then head over to the detailed Advanced Scripts Review written by me.

Find the important links related to all the tools that we're going to need:

Advanced Scripts Review: https://syncwin.com/review/advanced-scripts/
Advanced Scripts: https://syncwin.com/advanced-scripts (Affiliate Link)

Google Tag Manager: https://syncwin.com/google-tag-manager
Google Tag Assistant: https://syncwin.com/google-tag-assistant

Find The Google Tag Manager Script

Step #1. Login to your "Google Tag Manager" account.

Step #2. Select the account you want to use for your WordPress website (Here I'm assuming that you have already created a GTM Account).

Step #3. Head over to the "Admin Tab Menu" from the top of the page.

Step #4. Click on the "Install Google Tag Manager" link from the available link options.

Open The Advanced Scripts Window in WordPress

Step #1. Login to your "WordPress Admin Dashboard".

Step #2. Hover over to the "Tools" menu from the "Admin Sidebar" on the left.

Step #3. Click on the "Advanced Scripts" submenu under the "Tools" menu.

Add The Google Tag Manager Script in Advanced Script Manager

Google Tag Manager provides a total of 2 Scripts that you need to add to your WordPress site, one script to add on the "HTML Head" and the other one is to add in the "HTML Body Opening".

In this section, you will learn how to add them both on your WordPress site with the help of the Advanced Scripts plugin.

Install First GTM Code to The <Head>

Head Script for Google Tag Manager and WordPress Integration - Image - SyncWin

In this section, you will learn how to add the first GTM Script to your website Head with the help of the Advanced Scripts Plugin.

Step #1. Head over to the "Install Google Tag Manager" page again where we left off.

Step #2. Copy the "First Script" that is asking to add it to "<head>".

Step #3. Now get back to the "Advanced Script Manager" page again which is open on the WordPress backend.

Step #4. Add a name in the "Title" field (Example - Google Tag Manager: Header).

Step #5. Add further details in the "Description" field if required.

Step #6. Select "HTML" under the "Type" dropdown field options.

Step #7. Select "Front-end" under the "Location" dropdown field options.

Step #8. Add "wp_head" under the "Hooks" field.

Step #9. Leave the "Priority" field as "10" which is the default value.

Step #9. Leave the "Conditions" option default which should show "0 Conditions Set".

Step #11. Paste the snippet under the "HTML Code Field" area that you copied from the "Install Google Tag Manager" page.

Step #10. Now hit the "Save & Activate" button of Advanced Scripts and your 50% job is done.

Install Second GTM Code to The <Body>

Body Script for Google Tag Manager & WordPress Integration - Image - SyncWin

In this section, you will learn how to add the second GTM Script to your website Body with the help of the Advanced Scripts Plugin.

Step #1. Head over to the "Install Google Tag Manager" page once again.

Step #2. Copy the "Second Code" that is asking to add it to "<body>".

Step #3. Now get back to the "Advanced Script Manager" page on WordPress once again.

Step #4. Add a name in "Title Field" (Example: Google Tag Manager: Body).

Step #5. Add further details in the "Description" field if required.

Step #6. Select "HTML" under the "Type" dropdown field options.

Step #7. Select "Front-end" under the "Location" dropdown field options.

Step #8. Now if you are an Oxygen builder user then add "ct_before_builder" in the "Hooks" field.

OR if you are using a different theme and page builder then you need to add the "wp_body_open" in the "Hooks" field.

Step #8. Leave the "Priority" field as "10" which is the default value of Advanced Scripts.

Step #9. Leave the "Conditions" option default which should show "0 Conditions Set".

Step #10. Now hit the "Save & Activate" button of Advanced Scripts and the job is done.

Test if The Google Tag Manager is Working or Not

Adding the scripts on your site is not enough if they don't work properly. Therefore, you need to test if the GTM tag is working on your site or not, and in this section, I am going to show you the simplest method to do that.

Step #1. Add "Tag assistant (by Google)" browser extension to the "Chrome Browser".

Step #2. Open the "Frontend" of your website to the "Chrome Browser".

Step #3. Click on the "Tag Assistant Icon" from the "Top Bar of Chrome".

Step #4. Click the "Enable Button" from the dropdown window of the "Tag Assistant" to turn it on.

Step #5. Now "Reload the Website" or "The Browser Tab" (both does the same thing BTW).

Step #6. Now if the "Result of Tag Analysis" shows a bunch of tags that you have added on "Google Tag Manager", then your GTM Tag is working fine and if it shows nothing then you got it 😉

Conclusion

In this tutorial, I have shared step by step method to add Google Tag Manager Scripts on a WordPress website with the help of the Advanced Scripts plugin.

Find the important links related to all the tools that we've used throughout the tutorial:

Advanced Scripts Review: https://syncwin.com/review/advanced-scripts/
Advanced Scripts: https://syncwin.com/advanced-scripts (Affiliate Link)

Google Tag Manager: https://syncwin.com/google-tag-manager
Google Tag Assistant: https://syncwin.com/google-tag-assistant

I hope you found this tutorial very helpful and if that is the case then consider sharing this post with your friends and community to help them out as well.

Also if you have any feedback about this topic then feel free to share that in the comment section below. I would request you to be constructive and add value to the other readers.

Thanks a lot for visiting our website SyncWin.com.

A Google & HubSpot Certified Digital Marketing Specialist, Self-Taught WordPress Expert, Useful BizDev (Business Development) Tools & Deals Explorer, and the Founder of SyncWin & Toolonomy.

Leave a Comment

0 0 votes
Article Rating
Subscribe
Notify of
guest
3 Comments
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
Guido
Guido
1 year ago

I have the new version of AS and don't have this option for the second code:

Step #6. Select "Custom Hooks" under the "Location Dropdown Field" options.

How do i do it with the new version of AS?

Guido t Hooft
Guido t Hooft
Reply to  Mohammed Wasim Akram
1 year ago

Hi Mohammed,

I eventually figured it out lol. But always good to have your tutorial updated 😉

Thanks!

Guido

Explore our Facebook Community

Consider joining our Toolonomy Facebook Community if you want to involve in the group discussion with like-minded people about Business Development Tools.
Join Now
Made with ❤ for Digital Entrepreneurs
Copyright © 2018 - 2022 SyncWin | All Rights Reserved.
Top crossmenu