Technology
You can use Google Tag Manager to manage and deploy tags (sometimes called code or tracking pixels) on your website without having to modify the site’s code, get access to your server, or give others access you might not want them to have. Google Tag Manager (GTM) helps you with placing and modifying Google Analytics code, a Facebook pixel, and any number of other things that will help you track, report on, and better understand website performance. There are a lot of resources for learning to place GTM code on your website. Sadly, even Google’s own resources do not really tell you how to place the code. In this post, I hope you will find the most common scenarios people find themselves in when they need to add Google Tag Manager to their website.
Step 1- Get Your Code
If you’ve received codes from Google Tag Manager and want to install them on a site, they should look something like the images below:
Header Code:
This is the code that Google says needs to be placed in the header file of your website.
Body Code:
This is the code that Google says needs to be placed in the body file of your website.
Step 2- Place the Code
A lot of people recommend using a plugin because it’s a quick and convenient way to install code. You do not need to get access to your server, and often, you do not need to deal with any code. However, plugins can slow down your site, and disreputable plugins can open your site up to hacking, malware, and other problems. Manual coding can take more time to install AND remove, but it typically helps you maintain your site speed. Ultimately, there is no right or wrong way to install your code. You just need to do what works for you and your site.
Option A – Manual Code Placement
For this option, you often need access to the server your website is on. You need to find your site’s header and body files for this step. Paste the first bit of code as high in the <head> of the header file as possible (highlighted in blue in the example below). Then, paste the second bit of code immediately after the opening <body> tag in the body file on your server. If you are not using a content management system with standard sitewide files, like WordPress, you’ll need to repeat this process for each page on your website.
Option B – WordPress Manual Code Placement
At 27+ million live websites using WordPress as of this writing, it is easily the dominant content management system around the globe and therefore the most likely CMS you will find yourself using.
- Go to “Appearance”, then “Theme Editor”, then “header.php”.
2. Search for <head>.
3. Paste the first code before the closing </head> tag.
4. Save the code by clicking “Update File”.
5. While you’re still in the header.php section, scroll down and find <body>
6. Paste the second code script immediately after the opening <body> tag.
7. Save the code by clicking “Update File”.
Option C – WordPress Plugin
For this option, we recommend using Google Tag Manager for WordPress. Install the plugin just as you would any other WordPress Plugin. Depending on your level of access to your website, you might be able to do this yourself, or you might need an administrator, IT team, or website vendor to install the plugin.
After you’ve installed the plugin, you can access it by following these steps:
- Click plugins
- Click installed plugins
- Scroll until you find Google Tag Manager for WordPress and go to settings
4. Type in your Google Tag Manager ID (It will start with GTM-) and then scroll to the bottom of this page
5. At the bottom of the page, click save changes
Option D – Wix Code Placement
At +3.8 million live websites currently running on Wix, it is the second most common CMS around the world and therefore also the most likely CMS for you to find yourself using if you’re not using WordPress. Thankfully, Wix is already programmed to make code script installation easy. You won’t have to install a plugin or do any manual coding.
- Go to the settings tab on your Wix site
- Scroll down to Tracking and Analytics and then click Google Tag Manager
- Enter your Google Tag Manager container ID (begins with GTM-).
- Save your work.
Option E – All Other Content Management Systems
Squarespace, Joomla!, Shopify, and several other content management systems are all generally recognizable names and popular in their own right. However, all of these have significantly fewer sites using them than WordPress and Wix. If you find yourself needing to place Google Tag Manager code in one of these and you cannot find a solution, send us an email, and I will try to point you in the right direction.
Step 3- Test the Pixel
For the sake of this post, I’m assuming that someone else is going to test that the pixel is working. However, if you need to test it, Google Tag Manager has a method to do that as does every other pixel or tag that could be triggered by Google Tag Manager in your case such as a Facebook pixel, LinkedIn Insight Tag, Google Analytics, and so on.
If you do not have access to Google Tag Manager or do not know how to check, you can go to wappalyzer.com, scroll down to technology lookup, and paste in your URL. Any tags that should be triggered by Google Tag Manager will be listed if the pixel was placed properly.
If you have specific questions about placing your code, you can always use Google Support, hire a developer, or contact us.