First Steps on GTM and GA4: Part 2

Provided by Flaticon

I keep delaying on posting this because I was too locked in! Since the last post, I have learned a lot more.

Menu Link Click Setup in GTM

On previous post, I learned how to complete the initial setup for both Google Tag Manager & Google Analytics 4. The tags are fired during debugging, and the default events like page view, user interaction, scroll are also logged by GA4’s Debug View. After that, I worked on many things, which AnalyticsMania also helped a lot with.

First, the menu link tag. I want every visitor interaction with the navigation menu to be logged by GA4, so I set up the tag in GTM. I started with the trigger, where I chose the trigger type as Clicks – Just Links, and then the condition as Click Classes contains wp-block-navigation-item__content, as per how this site is coded. Then for the tag, I set the event name as menu_link_click. Another thing I need to set up is Event Parameters, so their details are logged by GA4. For this one, I chose the link_url and link_text as the parameters, while setting Click URL and Click Text as the values respectively. This way, I will know the page and the URL of the visited menu link! During this step I also saved my Measurement ID as a Constant so I don’t need to keep copy pasting it.

Second, the Booking tag. I completed the booking page with the help of WP Booking Calendar plugin. After so much back and forth, this is how I finished the set up. For the trigger, type should be Page View, and fires on Page Path contains /thank-you-for-booking/. And for the tag, Event Name was set up as booking-form-completed. The back and forth happened because I didn’t set the thank you message on a new page, so the previous triggers never fired. That day I learned!

CookieYes CMP Tag setup

Cookie Banner challenges

Done with Booking page, I moved to the third task, setting up a cookie banner to make the site GDPR compliant. I chose CookieYes for this. I spent four hours on this step, due to complications unforeseen to beginners. As a PSA, let me tell you this: if you’re considering CookieYes, choose either the plugin or the web app, not both!

If you activated them at the same time, there will be complications. I originally installed via WordPress plugin, and then the cookie banner was visible on my site. Then I go to their web app to finish the setup. This is where I did wrong.

I started the GCM setup following the method explained here, using the CookieYes CMP tag template in GTM. This is fairly simple, I just need to fill in the Website Key, as provided in their Advanced Settings menu, set the default consent settings, and chose Consent Initialization – All Pages as the firing triggers, to make sure this tag fires before any other tag.

It should be my last step if I didn’t install the plugin. Now the banner no longer shows on site, and the console log from Inspect menu are showing Uncaught RangeError: Maximum call stack size reached. This is because the script got injected twice in the <head> part of the html. Unfortunately I can’t show you the html code screenshot because the issue already resolved

Here’s how I resolved the situation. First, I go to CookieYes plugin menu. From there, head over to Site Settings. Click the Disconnect button. After that, I go to plugin menu, deactivate the CookieYes plugin, and then deleted the plugin.

Debugging the setup

I set up three new tags in GTM, let’s verify if they are working. While looking into debugging the other day, many analytics expert recommended to install Google Analytics Debugger extension, because sometimes GA4’s debug view is ironically bugged. Can confirm that happened to me. Let’s get started! I head over to GA4’s Admin > Data Display > DebugView and GTM’s tag assistant.

First, let’s check the menu link click event. Using GTM’s tag assistant, I can see that the CookieYes CMP tag fired before anything else, so that’s a good sign. I clicked on Journal menu link, the tags fired, and the event was also logged in GA4’s DebugView. I can move on to the next step.

Second, verifying the booking event. Just like before, tag assistant showed that Booking Completed tag fired, and the booking_form_completed event was also logged. I completed both the GTM & GA4 parts successfully!

I’ve been having a blast learning all of this. There’s so much more to learn about, I’m actually having difficulties where to go next. But this is it for now, thanks!

Comments

Leave a Reply

Your email address will not be published. Required fields are marked *