Add Google Analytics Code to your Child Theme Header

Sharing is caring!

Before we start: Avoid Duplicate Google Analytics Code

First off, there are many plugins that you can you use to add the google analytics code to your website. However, you only want to use ONE method. Since adding plugins can cause conflicts or affect site speed, here is an option available to you, to add the code yourself directly to the header.php file in your Child theme.

If you are using any other analytics plugin or have already installed this code on your parent theme, or in a “header/footer” plugin you will need to remove the duplicate Google Analytics code. Duplicate code will cause your analytics to be out of whack, an indication of this is that you will often start to see a very low bounce rate. Which may sound good at first, but it honestly is not.

Some examples of analytics plugins: Exact Metrics or Monster Insights you will need to disable these plugins if they are installed, so that you don’t end up with a duplicate of your Google Analytics code running on your site.

However, **Before** you disable any plugins and proceed, you need to know that Monster Insights plugin does track additional events in your google analytics that you may find useful that will no longer be available unless you add the event tracking through another method (not covered in this tutorial), as event tracking (link clicks, scrolling, etc) is not a default option.

What’s more, I believe both Monster Insights and Exact Metrics add the Google Analytics screen to your WordPress dashboard, which will no longer be available inside WordPress. Thus, you will now need to login to your google analytics console directly here: https://analytics.google.com/

Jump to the troubleshooting section below, is google analytics installed twice?

 

 

So why would you want to add the code yourself directly to the header file?

As nice as the above features are, they really can affect your site loading speed for your visitors. Google considers site speed as important for visitors usability of your site for SEO.

And once you get the hang of the Google Analytics Console, you will like using the console directly, there is lots of analytics info you may not have seen yet, that are not available on the WordPress dashboard.

So now, it is up to you, if you want to proceed, please follow along. Also, don’t forget to let me know in the comments how easy or difficult you find this tutorial and if it was useful to you. Include Any steps you needed to modify as it may help other readers.

First you will need your Google Analytics Code

In a new tab or window, you will need to login to your google analytics console https://analytics.google.com/ to get your analytics code to paste into the header file.

There are many methods you can use to add the Google Analytics code to your site. Again remember to just use one method.

Adding the Analytics Code to the Header Footer Code Manager

*Note: some themes include a header/footer section where you can add code without adding a plugin.

Install the Header Footer Code Manager plugin. Then add a new snippet fill in the information like below in the image.

Paste in your Google Analytics code, then click save.

Remember to clear your Site cache and browser cache.

Back on the Google Analytics code tab, there is a button to send test traffic to confirm that the code is working as expected.

Jump to the troubleshooting section below – why are no events showing in Google Analytics

If you’d prefer to add the code directly to your Child theme Header file instead of using the headers/footers plugin, continue below. Otherwise you have completed this tutorial.

Adding the Google Analytics Code to your Child Theme Header file.

Make sure to take a backup before you start. See this post here on backing up with Updraft Plus

For additional methods to edit your theme header see this post, the link will open in a new tab so you don’t lose your place.

**Make sure to take a backup of your website before you start** Instructions to backup with UpdraftPlus

First, you will need to login to your cPanel or FTP site on your host. You may also be able to do this from the WordPress file editor, however, on our sites this is disabled by our security settings.

The instructions contain examples from the Bluehost cPanel.

1. Login to your Bluehost account
2. Click Advanced
3. Select the File Manager


4. Navigate to your wordpress install theme folder
This is the location of the default install folder, yours may be slightly different. "public_html/wp-content/themes/"

If you do not yet have a child theme setup and would like information on how to do so,
see this post here: How to Setup a Child Theme for your WordPress Blog

Now that we are in the correct folder you need to copy the parent theme header.php file to your child theme folder.

Click on the Parent theme folder, in this example we are using the TwentyNineTeen Theme.



Right click on header.php file and click copy



– This is how the copy form will look at first



Add “-child” to the theme name, see the image below



If this is the first time adding files to your Child theme, you should now see these 4 files in your Child Theme folder


Then go to the child theme folder and right click on the header.php file and first select to download a copy and save to your computer as a backup

Note: in this instance, we are downloading this file to get in the practice of backing up your file before making changes, since this is the first copy of the file and you do have a clean copy of this file in the Parent folder, you could skip this step.



Then right click the header.php file (again) and this time select to EDIT



Paste the Google Analytics Code in the header as shown here, before the line that looks like this (this may be different for your theme, but it should still look fairly similar).


<?php wp_head(); ?>
</head>
Example before adding the code

Example after adding the Google Analytics code



Then save the file, and you can close it.



If you are following along and making these changes to your Child Theme Header file, then your analytics code will be safe (not overwritten) when your theme updates.

REMEMBER if you change themes, the header file code will need to be added to the new theme (or new child theme), you may also want to copy/move over any other changes you’ve added to this child theme to the new child theme.

Troubleshooting Google Analytics

In this section we will look at two possibilities that may show there is a problem.

• Too Low bounce rate – is Google Analytics installed twice?
• No Google Analytics events showing – is the code even installed?

On the Google Chrome browser, install the following extension Tag Assistant by Google (it may be available for other browsers, but I use it in Chrome).

Once installed visit any page on your website and enable the Tag Assistant.

Click on the extension on your browser and select to enable, then select to record.


Then refresh your page.

If you have the code installed correctly it should appear like this, the tag will show green:


Note, the part that says it is a non-standard implementation is okay. This is a false alert.



Info on Non-Standard implementation alert

If the code is installed twice or more you will see this yellow tag and the alert below.



If you see that your code is installed twice, double check your plugins. Do you have any plugins that are adding your analytics code for you, or are you using a header/footer plugin (or more than one) and adding the code in more than one spot?

Point of clarification – Google Tag Manager has 2 parts to its code, the <script> inside the header and the <noscript> just after the opening <body> tag, if you are using this code, it is correct to have both the script and noscript parts, these two parts together count as “one code”.

No Tags Found – Google Analytics not installed

This is the worst of the three options and can happen if you change themes without moving the code to the new theme or if you just haven’t installed Google Analytics code for your site yet. (Go back to the top of the article and follow the tutorial to install your Google Analytics code).

Related: Things to consider before changing your WordPress theme



If you need help, please ask in the comments or in our Facebook group.

 

Get the Checklist: Switching Themes.

Be prepared if you decide to change your WordPress theme

Count me in!

You have read and agree to our Privacy Policy

Count me in!

Thank you!

Please check your email to confirm your subscription, including spam/junk folder.

Glad to have you onboard!



 

Got blogging questions? Join my Facebook group here WP Blogger Assist Questions Advanced WordPress user with coding knowledge? Advanced Coding on WordPress