Google Tag Manager is a powerful tool for marketers that allows them to add, edit, and update website tags such as those used in analytics and marketing optimization. We’re not going to explain what Google Tag Manager is and how it is used in this article, so if you are interested in what it does and what’s it for, you can read Google’s article here. Now, we’re going focus on how add Google Tag Manager to WordPress.
Login to your Google Tag Manager account and then create a new container.
Fill out the necessary details, choose web in the “where to use the container” section and then click Create.
After that, you’ll receive the codes that you need in order to install Google Tag Manager in WordPress. Leave this page open because we are going to need them in the following steps.
Open a new tab and from there, login to your WordPress website. You can choose whether to install Google Tag Manager by adding the codes manually in your theme’s file or by using a WordPress Google tag manager plugin. Both methods require you to edit your theme’s file, but the latter comes with a better integration and additional features which you won’t have if you installed it manually.
Once you’re logged in, go to Plugins > Add New. In the search box, type “Google Tag Manager” and you’ll get a bunch of results. We’re going to use the plugin called “DuracellTomi’s Google Tag Manager for WordPress”.
Install and activate it.
Next, go to Settings > Google Tag Manager.
You will now be taken to the plugin’s configuration page, specifically under the General tab. Here, you will need to put your GTM ID (Google Tag Manager ID) in the box, then choose Custom under the Container code placement option.
To get your GTM ID, go back to Google Tag Manager’s tab that we left open earlier and click OK to close the dialog box so you can see your GTM ID. It can be found around the upper right corner of the page above the green box, see the image below (note that your ID will be different, so do not copy the ID in the screenshot).
Input the ID to the plugin’s page, make sure you choose the custom container code placement option, and click Save Changes.
Next, you need to add the custom function from the plugin to your WordPress theme to make it work.
Go to Appearance > Editor. You will be taken to WordPress’s theme editor. Here, we are going to edit your theme’s header.php file and add the plugin’s custom function just after the opening <body> tag.
Remember! You must be very careful not to edit or delete anything here recklessly or your theme will get broken! Keep this in mind while editing and you’ll be safe.
Each theme is different, but the most important thing that you need to keep in mind is that you only need to edit the header.php file and add the plugin’s function right after the opening body tag that’s found inside the said file. Refer to the image below for an example (it uses the Twenty Sixteen theme).
Under Templates, find Theme Header or header.php and click it to bring it to the editor window. Then, find the first<body> tag and immediately after it, in a new line, paste the plugin’s function. After that, scroll down to the bottom and click Update File. That’s it!
You now have installed Google Tag Manager in your WordPress site using a plugin! But there’s a catch: every time you update your theme, you will have to add the code snippet again. Why? Because every edit you do in your theme will be lost when it updates to a newer version. It is recommended to use a Child Theme to prevent this from happening.
To take advantage of the plugin’s additional and advanced features, refer to its page here: https://wordpress.org/plugins/duracelltomi-google-tag-manager/.
If you prefer using Google Tag Manager in its raw form, you can easily add its code manually. To do that, login to your Google Tag Manager account, open the container name of your target website, then click on the GTM ID around the upper right corner of the page to bring out the dialog box containing the necessary code snippets that you need.
Leave this page open. Then in a new tab, login to your WordPress site, go to Appearance > Editor.
You need to put two code snippets in your theme to install the tag manager. The first one should be placed as high as possible in the <head> section and the second one goes immediately after the opening <body> tag. Both of them can be found in your theme’s header.php (Theme Header) file.
Each theme is different and yours might not look exactly the same as the example we have in the image below (it uses Twenty Sixteen Theme), but remember that you need to find the header.php file. Click it to bring it to the editor window and put the Google Tag Manager codes in their rightful places (as high as possible in the <head> for the first snippet and right after the opening <body> tag for the second snippet). Refer to the image below as an example:
Once added, scroll down to the bottom and click Update File to save your changes. And there you go! You have successfully installed Google Tag Manager in WordPress! But there’s a catch! Every time your theme updates to a newer version, edits you made in the theme will be lost so you will have to repeat the process again every time it happens. To prevent you from manually doing it over and over again, it is recommended that you use a Child Theme so your edits will stay intact no matter how many updates your theme gets.