Webxopt

Turn a Website into a Business

T 07 3103 3259
M +61 409 825 759
E info@webxopt.com

  • Home
  • Why Us?
  • What We Do
  • B2B Websites
    • Case Study
  • REST API
  • Cybersecurity
  • Consulting
  • Articles
  • Contact
    • Privacy
    • Help Page

Analytics Content Grouping Using WordPress Categories and Not using Googles Tag Manager

October 9, 2017

Analytics Content Grouping can be very useful to see how a range of products is doing in the market in a quick and intuitive way and also allows for some interesting insights that are hard to get to in any other ways.

In the past I have relied on manual tagging of pages, but over time as new pages are added, this manual tagging drifts and the ‘not set’ category increases. As a way to automatically group pages a great way would be to use WordPress categories and group based on category names.

Before I go any further I should add that most of the pages I want to group are product pages and all of them are in multiple categories. For example a product might be in a categories for products, industrial, steel and more. This method is based on picking out a few of those categories only as groups. In this case Industrial is the group I want to add this to. If you have pages with 1 category only, there are other methods that are even more automated (see below).

I should add that this method is loosely based on the article of https://www.highposition.com/blog/how-to-send-author-content-groups-wordpress-google-analytics/ and I will follow the same steps that they take you through: –

Step 1 – Configuring Content Groups

Log into your analytics account and click on the Admin link in the top menu bar. Select the account and property you want and in the View section on the left, you should see Content Grouping: –

analytics-content-groups-setup1

We then need to create a new Content Group

Click the “Create New Content Grouping” button at the top.

Add in the title of your Group, in our case “Categories”.. but you can call it anything you wish.

Just below the title is where you select the tracking method you wish to use, we will be tracking via the GA javascript code, so click the first option, “Group By Tracking Code”, you don’t need to change anything on this screen, just press “Done” at the bottom.

Now do the same process again for any others you want to add to a maximum of 5, but when clicking the tracking code implementation option, make sure you change the “Index Number” option, so they are unique.

Step 2 – Modifying the Analytics Tracking Code

This article assumes that you are using the universal analytics code that Google has been pushing for some time. The code you have running on your site should therefore look something like this: –

<script>
(function(i,s,o,g,r,a,m){i[‘GoogleAnalyticsObject’]=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,’script’,’//www.google-analytics.com/analytics.js’,’ga’);

ga(‘create’, ‘UA-XXXXXX-X’, ‘auto’);
ga(‘send’, ‘pageview’);

</script>

We want to change it to add an extra line as shown below (in this case to add the category name, which is industrial to contentGroup4, which is the one I set up in the step above: –

<script>
(function(i,s,o,g,r,a,m){i[‘GoogleAnalyticsObject’]=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,’script’,’//www.google-analytics.com/analytics.js’,’ga’);

ga(‘create’, ‘UA-XXXXXX-X’, ‘auto’);
ga(‘set’, ‘contentGroup4’, ‘Industrial’);
ga(‘send’, ‘pageview’);

</script>

 

Find this code in your site. In theory it should be in the head section, but I load mine in the footer just in case Google is slow (which is quite often). You will often find this code in either the theme settings, a wordpress plugin or in the footer.php or header.php of the theme you are using. The code should look exactly as the top example above, so, after backing up, make a space between the ga(‘create’, ‘UA-XXXXXX-X’, ‘auto’); and ga(‘send’, ‘pageview’); lines to type in your new code to add the content groups.

The code I am using assumes that you know the groups you want to track, you have a page in multiple categories (see below if you have 1 category) and you don’t have many groups (as each one needs a line of code).

<?php
if(in_category(’19’)){echo “ga(‘set’, ‘contentGroup4’, ‘Industrial’);\n”;}
elseif(in_category(’16’)){echo “ga(‘set’, ‘contentGroup4’, ‘Industrial2’);\n”;}
elseif(in_category(’18’)){echo “ga(‘set’, ‘contentGroup4’, ‘Industrial3’);\n”;}
elseif(in_category(’11’)){echo “ga(‘set’, ‘contentGroup4’, ‘Industrial4’);\n”;}
?>

So this is very simple, each line checks to see if the page is in a particular category and if it is adds the analytics code to tag to page. In more detail:

if(in_category(‘19‘)) – Checks to see if the page is in category 19. You can get the category number easily by going to the category page in WordPress (under Posts), finding the particular category you want, then hovering your mouse over the top. In most browsers you will see the url of the link you would go to if you clicked. In that url you will see “tag_ID=19” in this case, but the number is the number you need to enter here.

{echo “ga(‘set’, ‘contentGroup4’, ‘Industrial’);\n”;} – This bit is just the code from analytics, but I have manually written in the category name. In this case Industrial. You could do this in code, but if I am setting the category ID for an individual line, you might as well just add it in manually. \n gives you the line break.

If you add that in to your analytics code it should look like the below: –

<script>
(function(i,s,o,g,r,a,m){i[‘GoogleAnalyticsObject’]=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,’script’,’//www.google-analytics.com/analytics.js’,’ga’);

ga(‘create’, ‘UA-XXXXXX-X’, ‘auto’);
<?php
if(in_category(’19’)){echo “ga(‘set’, ‘contentGroup4’, ‘Industrial’);\n”;}
elseif(in_category(’16’)){echo “ga(‘set’, ‘contentGroup4’, ‘Industrial2’);\n”;}
elseif(in_category(’18’)){echo “ga(‘set’, ‘contentGroup4’, ‘Industrial3’);\n”;}
elseif(in_category(’11’)){echo “ga(‘set’, ‘contentGroup4’, ‘Industrial4’);\n”;}
?>
ga(‘send’, ‘pageview’);

</script>

Once you load up a page this should then be tagged appropriately with the categories you have set.

Step 3 – Viewing Your Data

Once this new data has begun flowing in to your GA account, head over to your All Pages Report….  Behaviour -> Site Content -> All Pages

analytics-content-groups-setup2You will see a new option appear at the top of the report asking which content group you would like to see your pages grouped by. You should now see your groups in there. Select the group you want and it will show you pages together with useful on-site behavioural metrics. This can be very useful to see how certain sections or product ranges are performing against site stats over time.

Another interesting way to display this information is in a Dashboard. I particularly like to use the map view on the dashboard so I can see how particular groups are performing in different parts of the country or the world: –

 

 

If you have Single Category for Each Page

If each of your pages only has a single category, and you have a much larger range of categories. You may want to use this code instead as it automatically fetches the 1st category the post is in. Note that this is for Universal Analytics and also creates a group for the first tag. If you don’t want the tag group, just delete that section: –

<?php if (is_single()){
while(have_posts() ) : the_post();

$category = get_the_category();
if ($category && !empty($category[0]->cat_name)){
echo “ga(‘set’, ‘contentGroup4’, ‘”.$category[0]->cat_name.”‘);\n”;
}

$tag = get_the_tag();
if ($tag && !empty($tag[0]->tag_name)){
echo “ga(‘set’, ‘contentGroup5’, ‘”.$tag[0]->tag_name.”‘);\n”;
}

endwhile; // end of the loop.
}
?>

Explanation

<?php if (is_single()){
while(have_posts() ) : the_post();

………..

endwhile; // end of the loop.
}
?>

This section just makes sure that the page includes a single post only.

$category = get_the_category();

This section creates a group (array) of categories.

if ($category && !empty($category[0]->cat_name)){

This makes sure there is a category assigned and if there is applies the category name rather than the ID number or slug.

echo “ga(‘set’, ‘contentGroup4’, ‘”.$category[0]->cat_name.”‘);\n”;

This is the section that actually writes the line into the page html (echo). In this case the start of that is all just text from Google analytics. Change contentGroup5 to whatever content group you have set in the Analytics admin panel. The options are basically contentGroup1 to contentGroup5. The next bit ‘”.$category[0]->cat_name.”‘ is really the crucial bit that pulls in the category name. This will be the first category on the list you see in the pages, All pages list in WordPress.

Filed Under: Articles Tagged With: Tech Comment, Web Development

jQuery to Add Content to a Column with Header Copy

October 9, 2017

I have recently had to use jQuery to add some copy to a column in a table. The problem I had was identifying which column. In my case the each column had it’s own class eg: –

<thead>
<tr>
<th class=”column-1″>Model Number</th>
<th class=”column-2″>Height</th>
<th class=”column-3″>Width</th>
<th class=”column-4″>Enquiry</th>
</tr>
</thead>

What I wanted to do was add some html (including a variable that represented the enquiry form) to the Enquiry column, in this case it would be column-4.

This all looks pretty simple if you have the same number of columns for each table, but I didn’t, so I needed to look for the enquiry column, then mark it to add the code to. The workflow is therefore: –

  • Find the column class where the column header (th) has the text Enquiry
  • Mark that column class by adding an extra new class, in this case enqcol
  • Add the additional code to the column with the enqcol class

Our code is as follows: –

var classname = $( “th:contains(‘Enquiry’)” ).attr( ‘class’ )
$(‘table tr td.’+ classname).addClass(‘enqcol’);
$(‘td.enqcol’).html(‘<a href=\”‘ + enquiryform + ‘\”><img src=\”http://simongriffiths.name/images/enquriy-icon.png\” alt=\”Quick Quote\” width=\”15\” border=\”0\”></a>’);

The first line defines a variable called classname. This is set as the name of the class of the table header (th) that contains “Enquiry”. The result in the example above would be that classname=”column-4″.

The second line uses the variable above. It adds the class enqcol to any table cell (td) with the classname=”column-4″. Therefore at this point our code would be modified by jQuery to become: –

<thead>
<tr>
<th class=”column-1″>Model Number</th>
<th class=”column-2″>Height</th>
<th class=”column-3″>Width</th>
<th class=”column-4 enqol”>Enquiry</th>
</tr>
</thead>

The last line essentially looks for a table cell with the class enqcol (td.enqcol) and adds the html shown. In this case we are adding: –

<a href=\”‘ + enquiryform + ‘\”><img src=\”http://simongriffiths.name/images/enquriy-icon.png\” alt=\”Quick Quote\” width=\”15\” border=\”0\”></a>

Note that the \ allows the ” to show as part of the text to be added rather than being part of the code.

In this case you can substitute the html above with anything you like, but I am a variable “enquiryform” which is the URL of a page I have set elsewhere as a link and I am adding an icon rather than copy to link from.

It should be noted that this relies on each column being marked with a class. If this isn’t the case, you can probably add classes with jQuery before you run this step. You may even be able to modify this code to use the child number rather than looking for a class.

Filed Under: Articles Tagged With: jQuery, Table, Tech Comment, Web Development

Recent Posts

  • S/MIME Certificate – Sectigo Usage
  • Cybersecurity for Australian Small/Micro Business – Networks 2 – DNS
  • Cybersecurity for Australian Small/Micro Business – Networks 1 – Routers
  • Cybersecurity for Australian Small/Micro Business – Mobile, Part 2
  • Cybersecurity for Australian Small/Micro Business – Mobile, Part 1

Advanced Help

Enter your code in here. You will need to contact me first for a code!

Simon Griffiths in San Francisco

Webxopt was formed in 2009 by Simon Griffiths, who was at the time working as the Marketing Manager of a medium sized company in the electrical industry. Simons background includes study of both … Read More

Awards – Graduate Certificate in Cybersecurity

Robina Town Centre - Webxopt

Webxopt Pty Ltd
PO Box 16
Robina Town Centre
QLD 4230, Australia

T 07 3103 3259
E info@webxopt.com
ABN: 24 624 264 951

© 2025 · Webxopt · Built on the Genesis Framework