How To Track a Button Click in GA4 (Google Analytics 4)

hi everyone uh welcome again to another uh ga4 uh tutorial so today I'm going to show you really uh a simple uh way um to track a button click um on G4 so I had to set up uh some tracking for for a button click basically um and also how to make that as a conversion should should you so wish um so let's uh Jump Right In I'm going to share my uh screen so just give me a second to bring bring up the correct screen which you should see um and here we have again uh my fake shop um and we're visiting this lovely fake e-commerce store once again for this uh tutorial um and we are going to be in a position where we've got something on our site that we want to track and it's a button click right so you might have a call to action button on your website or it might be um an anchor a CTA button that's an an anchor button right that takes you somewhere else on the site or might be a contact but either way it's a call to action CTA button on your website that you want to track um with using G4 so you want to understand how many people are actually clicking on that button so um the button that I'm going to uh show the example on today is going to the button on the form um which is uh on our site so I'm going to use this button here um to to show you how to track uh a button and we're going to be using Google tag manager to do this um so if you haven't already got Google tag manager on your website and implemented then you need to do that um we have a video to show you how to do that um but uh let's get straight in there um I'm just going to open up Google tag manager and the F very first thing that we need to do uh using Google tag manager is um go to our uh variables uh dropped down on the left hand side and we need to configure these Vari variables so we need to go to configure and we need to scroll down and we need to click and we basically need to check the check boxes of all of these ones and while we're here I'm also going to put forms in there as well okay so all of these variables have been added and close that down and you can see that they've appeared here now right um so the the next thing that I'm going to do is I'm going to create a trigger so I'm going to create a new trigger and this is just going to be called clicks and all clicks so I just want a trigger that basically created for Anytime a click is made on my my site so I'm going to click uh configuration open up this window and then just click all elements and I'm going to leave this on all clicks save that and then I'm going to go over to preview which brings up the uh Google tag assistant um and D dbug mode I'm going to connect the domain and then I'm going to go over to the contact form and all I'm going to do is Click around so I said I've made two clicks there and you will see that these two clicks should appear right so it's it's it's noticing that I'm making these clicks on the page so if I then actually click on an element on the page let's if I actually click on this submit button I know I haven't filled the form in but let's just say I clicked on the button in this case um let's go to the tager system we know that our last click was on that button right so we can go down I'm just make sure it's still connected here is that registering here we go so you can see this number here number 24 here was the click on that and the reason why I can tell is because I've gone into variables here and I can see all the variables that were on that that the information that's on that click right so that's the best way to think about it the variables that are associated with that at the action of that click that I just made and you can see things like click Text with submit right so if we take a look at that button the button is submit right it says submit on there we can also see um some other uh interesting things like you know the actual click ID so the click ID is WP forms submit 66 so we've got some other things here and if we scroll down we've also got some other information there as well but this is how we're going to build our trigger for our button which we can then attach attached to a tag which we then can send over to ga4 so first of all back over to Google tag manager we're now going to create a new trigger and this trigger is going to be called CTA button click so call to action but button click and we are going to have all elements but this time we're going to say some clicks now I'm going to come back over to my tag assistant window and look at this click again and I'm going to pick out in this instance click Text so I can see that the click Text contains submit right so I'm going to copy that and I'm going to take that over and here in this dropdown some clicks I know that it was click Text contains paste submit okay save that so now now I've got my trigger that trigger is going to that that that's going to be a trigger that that fires when somebody clicks on that button right on on click Text Now what we could also add to that is we could also add on this some further filters and and and basically some further ways to actually filter that for in that trigger will fire so for example if we only wanted this to to um fire on that particular contact page okay we could actually go well you know this is the contact page so we' copy that and we could actually further Define that the page URL contains contact right so both of these things have to be true for that to to fire so you can further you know uh customize and filter through so let's let's take that for now right so we know that it has to be on the contact page and this click Text has to contain submit so we save that right now we have to attach that to a tag so go over to the tags and then what we can do is create a new tag and this is going to be ga4 and it's going to be a CTA button click okay and what we're going to be doing is clicking on T configuration going to Google analytics and then going to ga4 event now in the G a for event we're going to need our measurement ID and we're also going to need an event name so we can pop over to our Google analytics 4 property and we can go and grab our measurement ID which is found in data streams click on your web data stream copy your measurement ID over uh where Are We Wrong tabs and paste that in and event name we can call this CTA button click now with ga4 um the event names need to be lowercase and you need to use underscores okay so you need to this is the naming conventions that you need to follow and then when we come down to triggering we can select the trigger that we've just created so we've actually created that trigger CTA button click so that trigger is going to tell that tag to fire which will then send the information over to ga4 so let's save that and then we'll close down these two uh tabs which we have our tag assistant open with and we'll actually preview that again so we'll open those back up and then we'll do we'll we'll complete a new test we'll go to contact and I'm going to click on this button and go to tag assistant and you'll see now that on this contact but this click go here we can see that this tag actually fired and why did it fire well all of these things were true right we're on this page the click Text contains submit and it was a click event so that is now succeeded and that will be firing information over to G4 and G4 should start seeing that but how do we check that ga4 is actually receiving that signal well let's go back to ga4 and go to our property and in the admin panel we can go down to the debug View and we should be able to see all of that information that's been sent over from that debug window that we've just been that should be picking up in in Google analytics for as well so as you can see here we can see that the CTA button click is there okay it's it's yeah it's here it's appearing which is great news so once we have that you've got two options now if this is a valuable action for your website for your business then you might want to to consider adding this as a conversion now if it's not you might just want to track the event and have that custom event right so what we're using here is creating custom events now that event you can have that event and you can track that event and you can monitor it right but it's not a conversion so if you wanted to bring that into your conversion reports then you would need to mark this as a conversion and to do that if you just copy this and on the left hand side or you you can go back to the admin panel but on the left hand side you can see conversions now if you go new conversion event and then paste paste the uh event name exactly as it is and then save now what that is is that's telling go ga4 straight away that you want to mark that as a conversion so from from the from the off it knows that this you know you're marking this as a conversion okay so if we go back over to events sorry if back over to debug view then in the past of course this was still an event but let's what say if we actually complete that uh we still got this window connected in the um in the tag assistant so if I submit that again okay and just make sure that that's registered it I believe it has if we go back over to debug and see if it registers on here here we go it's registered the event and hopefully it should register that it should be looking at it as a conversion now as well now we've made that change but it doesn't look like it has so let's try a Refresh on this side okay let's try Refresh on that side let's try it again we'll try it another couple of times if I go to the about page go to contact and then if I go down to submit again and click that button it's definitely registering over here is it registering on the debug on Google analytics there we go okay so it's recognize at that time so you can now see that that is now marked as a conversion because it's come up with a green flag instead of the usual blue event symbols right so the CTA butt but click is is there so it's recognizing that as a conversion great that's all done the one thing that you need to make sure that you do though is that once you've checked it all is that go back over to Google uh Google tag manager once you've made all those changes you need to make sure that you submit that particular version that those changes that you've made you need to make them live and publish them on your site so we've added so just add a a version name so I'll put like added um CTA button click um ga4 event right and if you're in like a bigger team then of course fill this out with lots of description and you know if there's going to be more more people on your team that are using this then make sure you know you you really do use the description to obviously explain what you've done but in this case it's just me so I can just publish and just make sure that you've actually published that container for the for those changes to actually go live on your website and start tracking properly and the tracking we did was just the debug view right so it was it it wasn't actually properly live so this time this is prop properly live okay and that's it so that's how we uh track a uh CTA button click in ga4 using the custom events now I hope that was helpful please you know have a look at some of our other videos and let me know uh in the comments if there's anything that you uh yeah want to add or anything you want to ask and yeah hope that was helpful and uh hopefully see you next time yeah thanks very much for stopping by and um stop my screen share now and yeah thanks very much and hope to see you soon

Channel: Vixen Digital

Views: 3,353

Keywords: GA4 Button Tracking, Google Tag Manager Tutorial, GA4 Conversion Tracking, Button Click Analytics, GA4 Custom Events, GTM Setup Guide, GA4 for Beginners, GTM Event Tracking, CTA Button Tracking, Google Analytics 4 Tips, GA4 and GTM Integration, Web Analytics Techniques, Conversion Optimization GA4, Track User Engagement GA4, GA4 Analytics Tutorial, Implement GTM for GA4, Click Tracking in GA4, GA4 Tracking Guide, Online Marketing Tracking, Google Tag Manager Basics

Id: UDXyRj5Zkbc

Length: 14min 4sec (844 seconds)

Published: Fri Feb 09 2024