News/Articles

You have gone through the work to build your eCommerce online store, awesome travel blog, or your business brochure site. At this point, you are probably thinking how can I tell if my site is being used effectively, whether my sites content is engaging, or are my eCommerce landing pages working as they should. As a blogger or small business owner, you want to know information about visitors to your website. You want to know what pages they visit most, how long they stay on your site, what is your bounce rate (percentage of visitors who stay on your site for a given amount of time), and many more metrics.

To analyze this information you need to start collecting data about your website.

There are a number of metric collection tools on the Internet that can collect this type of data including SE Ranking, Woopra, and Google Analytics. We recommend Google Analytics to our clients. In fact, we will usually include this option in most of our eCommerce or web design proposals. We feel it is that important to you and your business. Google Analytics has been the de facto analysis tool for years, includes many data points and is free to use. Plus, if you need more analysis metrics you can also upgrade to their paid Google Analytics 360 tool for enterprises.

Although this article is not about what Google Analytics can track, here are some basic stats it will show you. Google Analytics gives you statistics like the number of users and sessions over a period of time, your website’s bounce rate, the average session duration, where those visits originated, and much more. It is a very powerful tool plus it integrates with other Google marketing tools like Tag Manager and Google Ads. If you want more information about what Google Analytics can do find it in Analytics Help.

Now that I have convinced you to integrate Google Analytics with your site so you can start collecting that precious data, how do we do that.

Get Your Google Tag Manager ID

We need two pieces of information first. Your Google Tag Manager ID for Google Analytics and a couple of snippets of code. Not to worry, we can find both in the same place once we do some setup. You will need to create a Google Analytics account and a Google Tag Manager account if you do not already have these. Then you will need to link the two accounts within Google Tag Manager. We then need to create a Google Tag Manager ID (Tag) that links to your Google Analytics Tracking Code. This way you can manage your Analytics code through Google Tag Manager.

We aren’t going to cover how to do this in this article but here is a walk-through from Google on how to link them: Deploy Google Analytics with Tag Manager.

Why use Google Tag Manager? Google Tag Manager gives you a central location to manage not only your Analytics Tracking but also your different ad campaigns including Google Ads, Twitter, Bing Ads and many more. Google integrates everything together under their Google Marketing Platform and gives the site owner a great set of tools to work with.

After you have linked your Google Analytics ID to Google Tag Manager you just need to open Tag Manager for your site and jot down or copy the Google Tag Manager ID for your websites Analytics tracking. The image below shows where you can find the ID. The ID will look something like GTM-XXXXXXX.

We will need the code snippets for two of our options below. These can be found by clicking the ID link. This shows a popup dialog with the exact code snippets we will need. Google also displays suggestions about where to add them in your website.

Add Google Analytics

I will show you three ways to add Google Analytics tracking to your WordPress website. This can be done by adding code snippets to a child theme’s header.php file, a child theme’s functions.php file or using a WordPress plugin.

Why a Child Theme?

You could add Google Analytics by adding the code snippets above directly to your theme’s header.php file. This might be fine if you wrote your own theme but, if you have a free or premium theme from one of the many theme vendors you probably should not use this method due to theme updates. When a theme author sends out an update your changes will be overwritten. In these cases, make sure you create and use a child theme. Documentation on creating child themes can be found in the WordPress Codex here: WordPress Child Themes. Using a child theme is considered a WordPress best practice.

Adding Google Analytics – Child Theme’s Header.php

Once you have your child theme setup, it’s not too difficult to add the code snippets that Google Tag Manager gives you. Open the header.php file found in your child theme’s folder. If you do not have one you can copy the header.php file from the parent theme’s folder and change it. See the screenshot below where I have added the two snippets. One is directly after the <head> element and the second is immediately after the <body> element.

At this point, you may ask why are there two code snippets? The first code snippet provided by Google is a javascript code snippet that will be used if your browser supports javascript which is most likely. The second code snippet is provided for situations where javascript is turned off or your browser does not support javascript. The second option is unlikely. I always include it just in case.

This solution although functional and works is not an optimal solution. As a best practice we as developers should abstract this from our presentation layer. Also, this may cause difficulties when moving your site to another theme or when you have to remember where you put that Google Analytics code when Google changes to another iteration of tracking tech.

Add Google Analytics – Child Theme’s Functions.php

Another solution could be to add a couple of hook callback functions to our child theme’s functions.php file. Simply add the following code to your child theme’s functions.php file and replace HEAD_FROM_GTM_INTERFACE with the first code snippet from Google Tag Manager. Then replace BODY_FROM_GTM_INTERFACE with the second code snippet from Google Tag Manager. You can add these anywhere in the functions.php file.

function google_analytics_for_head(){
?>
HEAD_FROM_GTM_INTERFACE
<?php
}
add_action('wp_head', 'google_analytics_for_head');

function google_analytics_for_body(){
?>
BODY_FROM_GTM_INTERFACE
<?php
}
add_action('wp_footer', 'google_analytics_for_body');

It really is that simple to do. Again, remember to use a child theme in these cases.

This solution is a little better than our first example but it still has some drawbacks. It does help with abstracting out from our presentation layer. We will still need to remember that we put this code in place.

You will also notice that the second code snippet is not added immediately after the <body> tag but within the footer element. This will work for most websites but you may lose data if a visitor exits your website before the footer section loads. This issue is on the change list for WordPress core and will be addressed in a future release. You can check on the status here: New action on body open.

Add Google Analytics Using a WordPress Plugin

Another solution is to install a WordPress plugin or write your own plugin for this functionality. We will not cover writing your own plugin for WordPress in this article. That would take at least another lengthy article to cover thoroughly. We will cover installing a WordPress plugin and setting up Google Analytics with it.

For this tutorial we will use Google Analytics by WebKinder. It is a lightweight plugin that gives us the functionality we need without to many options to worry about. There are numerous other Google Analytics plugins with a similar setup. Most will show Google Analytics data in your dashboard. I like to view this data from within Google Analytics but some use cases may require it. It really comes down to whether the plugin options fit your or your clients needs.

Installing the plugin

In your WordPress dashboard go to Plugins|Add New.

Next, search for “Google Analytics WebKinder”.

Then click “Install Now” and then “Activate” – this lets you use the newly installed plugin.

Go to Settings|Google Analytics in your WordPress Dashboard.

You only need to set two options in the Google Analytics setting page. Make sure you check Use Google Tag Manager instead and add your Google Tag Manager ID we recorded earlier. Remember it is in the form of GTM-XXXXXXX. Then click Save Changes and you are now collecting Google Analytics data.

What are the other options?

• GA Tracking Code is used when you are not using Google Tag Manager to manage your Google Analytics. 
• Anonymize IP’s was added as a requirement for the European Union’s GDPR changes. One of their privacy requirements is to anonymize user data. This way we won’t know our visitor’s IP address.
• Track logged in users – depending on how you use your website you may or may not need to track logged in users.
• Do not track any visits from this device – This allows you to not track visits from your device.

How to Check Google Analytics

Google Analytics provides you a couple of ways to do this in the help topic Check if a web page uses Analytics. Google Analytics says to log in to our Analytics account and check your real-time reports. If you are on a page on your site you should see at least one active user. It also explains how you can view the pages source code in Chrome and check for each code snippet.

We have found a useful tool, GA Checker. Just enter your site’s URL and click “Check Your Site”. GA Checker will walk your site and check all of your pages and show you a table listing the type of analytics that are installed on your website. This way you do not need to check each page’s source individually. That could be a huge time saver depending on the size of your site.

Let’s Wrap Up

I have shown you three ways to add Google Analytics to your WordPress site. I have included why one option might be better than others but, it will depend on your use case or requirements. We recommend to our clients to use a WordPress plugin as it is simple, straightforward and does not add plugin bloat to your site.

The article also lists a couple of ways to make sure Google Analytics is installed on your site.

Hopefully, this will help you get the data you need to analyze the performance and effectiveness of your website.

Let me know how I did or if I have missed something by letting me know in the comments.