Google Analytics 4 not working with cactus theme

I can’t get google analytics to work with my site, after following the Hugo internal templates suggestion. I’m using cactus theme and hugo v0.100.0. I keep getting the error using google analytics tag-assistant that “Legacy tag for G-CXBJ7FZNWP detected”, and that’s the only info into an error that I have. Please provide guidance? I’m quite lost.

I’m not sure how your config file looks like but the theme also have an additional config var called googleAnalyticsAsync, and you probably copied the config from the theme’s /exampleSite/ folder where it is set to true.

Try to set googleAnalyticsAsync to false in your own config file:

googleAnalyticsAsync = false # use asynchronous tracking. Synchronous tracking by default

As per Internal Templates | Hugo GA4 is only available in the non-async Analytics code.

1 Like

Thanks for the quick response, @techmagus! I am already using googleAnalyticsAsync = false, you can see my config.toml file on github.

I should add, this line that you suggest wasn’t necessary–I only added it as a debugging attempt; when I rebuilt the site with hugo -D after adding it, it didn’t change the public files at all.

For more debugging info, I’ve pasted below the feedback that I get from the Google Tag Assistant Companion and Google Tag Assistant Legacy. One thing I noticed is the “Legacy tag detected”, and “protocol version number = 1”, though GA4 should be “protocol version number = 2”. I tried manually changing this, to no avail.


Unless I am missing something, the general template for GA3 and 4 referring to analytics.js as checked.

GA4 shall refer to gtag.js by default, maybe that is why is not working.

Try this minimal approach and advise if is working with it. If yes, than internal template need to be updated.

1 Like

Thanks @idarek. I tried your suggested code, and still it’s not working. You can see where I manually placed it at the top of <head> for example here. You can see that I stopped at Minimal Analytics 4 - masking (hiding) requests; I just manually turned off my adblocker instead, and I’m getting Status:200 on the google-analytics request in the developer-console network tab.

I would note, that when I use your script, I’m still seeing Measurement Protocol as v=1 in the Query Headers, so perhaps I’m doing something wrong…

There is something wrong as using mine you will not see v=1, it looks you may have some cache issue and not the right script is served.

Your source looks correct however your site doesn’t have that.

ps.
this

ga('create', 'G-CXBJ7FZNWP', 'auto');
        ga('send', 'pageview');

will not work with GA4, as GA4 require page_view event. The pageview for is for GA3.

2 Likes

Hmm, interesting, thanks! I’ll take a look at this some time in the next 24 hours, I appreciate your assistance :pray:

Hi @idarek, I haven’t been able to figure it out. How would I have a cache issue, if I’m using incognito mode to test? (Sorry, I’m a bit of a noobie when it comes to web stuff).

Also, I don’t understand your “PS”. Where are you referencing this from:

ga('create', 'G-CXBJ7FZNWP', 'auto');
        ga('send', 'pageview');

If you look at the source of your website (chrome or edge: view-source:https://benfeifke.com/), then you will see that you loading the following GA code.

<script type=application/javascript>var doNotTrack=false;if(!doNotTrack){(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','https://www.google-analytics.com/analytics.js','ga');ga('create','G-CXBJ7FZNWP','auto');ga('send','pageview');}</script>

GA4 is using gtag.js rather than analytics.js hence you still loading the internal template or some else.

If you can remove from your config any analytics tracking ID etc. then into your head.html paste code from here replacing G-XXXXXXXXXX with G-CXBJ7FZNWP.

Then publish your side, check the source code when published that the right script is in the head and see if GA4 is tracking your visits.

1 Like

@bfeif
I think you should remove this from your config:
googleAnalyticsAsync = false
That isn’t needed

@coliff, I’ve tried this already, so it’s not the issue. But thank you!

@idarek thank you for the suggestion, and sorry for the delay–I had some overseas travel.

I saw what you were referring to with the view=source:https://benfeifke.com/. Quite strange if you ask me. Alas.

I’ve now removed from my config any analytics tracking ID etc, and taken the code from your site and pasted it manually into my html source code. However, now I’m seeing that the script from your site is not “staying” in <head>, even though it’s right there in the source-code. Do you have any idea why that might be the case?

Question, as noticed that you are using external theme, are you pulled theme locally or theme is pulled during build from official GitHub repo?

As if that the 2nd, than head is pulled from theme not your and that may be the case. Could you share your site repo or if is not public could you add me to your repo temporarily and will have a look for you.

1 Like

Hey there @idarek , that’s a great point! I am using a theme, and I do pull it locally and build the site locally, but I’m not sure what’s happening on deployment.
My site repo is here. It’s public, let me know if you need any other access. Thanks so much!

As I expect,
If you go to themes folder you can see that it’s just a reference to pull cactus @ a27a143 theme.

Whatever changes you do with the theme are overwritten by theme cactus and issue a27a143

You need to git remove the theme, then download the theme in ZIP format (or just save your theme that you got local in a different folder for now). If you add theme as git submodule add ... then just same command with remove I think (just backup your theme folder).

this is probably why the creator of that theme suggests to clone the theme rather than adding it as submodule in case you want to edit it.

Personally don’t like adding themes as submodules but that’s always the easiest way to work on the latest release. If you planning to modify then sometimes is just better to use “fully” local.

1 Like

@idarek ! So sorry it took me so long to get back to you.

Just yesterday, I got everything up and running, finally. My solution was to fork the theme, update it with some hard-coding for GA-4 instead of using the hugo internal template, (which seemed like it was getting tripped up at the GA-4 vs UA check somehow), and use the forked theme as a submodule in my hugo website.

Thank you so much for your persistent assistance! Really, there’s no way I could have come to this solution otherwise, and I learned a lot about GA, debugging websites, and hugo along the way. Cheers!

2 Likes