How to send specific information from client side to Google Analytic 4 (NOT Universal)? - google-tag-manager

While defining tag and triggers in Google Tag Manager, is there a way I could define that specific information from my client goes into GA4? for example I want to send the so-called store code whenever a user click on a button, so that I can understand exactly which store has had this click. The click event is not my point, I have already defined the tag and trigger, my problem is that why in the response GA4 gives me some info is missing.
in my Tag I have defined a new event with the parameter shown in photo:
then the trigger is
Thank you in advance

You can just modify the parameter name like this
If this setting is not working. Then the problem will be the {{Click Text}} is not returning as you expected.

Ok I found a way to send info, based on this link [GA4] Custom events which is a JavaScript code. However this is not what I was searching for because it is dependent to coding part and I wanted something which I can do from GTM
<script>
/**
* The following event is sent when the page loads. You could
* wrap the event in a function to call the event when certain
* events (e.g., a click event) happen on your site.
*/
gtag('event', 'Your Event Name', {
'your_param1': 'value 1',
'your_param2': 'value 2',
});
</script>

Related

Sending event to specific property

I am trying to send an event to a specific property on a page. The page has multiple properties on it and I only want to raise this event in one specific property.
I have used ga.getAll() to see the properties on the page and the one I want is labeled gtm3 so this is code I am trying:
ga("gtm3.send", {
hitType: "event",
eventCategory: "Heartbeat",
eventAction: "Beat",
eventLabel: "Heartbeat",
nonInteraction: true
});
This does not work, debug mode gives me the message:
command ignored. unknown target undefined
What did I do wrong?
I am testing this in console also so the tag is definitely registered. Am I referencing it wrong? In the getAll() I can see the property name: "gtm3".
I am running this code on doc ready but have also tested direct in console so I don't think it is a timing issue. What is proper way to reference this property and reference an event?
edit:
I also get the same message when I just run a simple: ga('send', 'pageview');
Why is target undefined?
OP was using Google Tag Manager as the method for GA implementation. Suggested to use DataLayer events to send the heart-beat event to GTM and utilize triggers within GTM to send the heart beat event to the appropriate GA property.
DataLayer Trigger on page:
....
DataLayer.push('event':'heart-beat');
....
The above is captured within GTM in a Custom Event trigger.
The Custom Event trigger is then used on a GA Event Tag set to non-interaction.

Google Tag Manager - Form Trigger Firing

I created a GTM tag / trigger for form submit as follows:
Tag:
Track Type: Event
Category: FormSubmissions
Action: Submit
Label: AskForAQuote
--
Triggering:
Trigger Type: Form Submission
Wait for Tags: true
Check Validation: true
Enable this trigger when: Page URL == X
This trigger fires on: Page URL == X
I then setup a goal to treat a conversion to occur when I receive:
Goal Details:
Category == FormSubmissions, Action == Submit, Label == AskForAQuote
So it is working and I do see goals converting when I submit the form, but I was curious about something:
When I enter preview mode (which pulls up the special preview GTM pane where you can see the activity) the trigger says it fired. My preconditions are simply that the page url == X as you see above.
Does that just mean the preconditions "fired" in the sense it's valid? Or does it mean it actually tracked a goal. I'd have to assume a basic GTM form SUBMIT trigger fires when the actual html form is SUBMITTED, not when you arrive on a page.
Is this me being paranoid, or is something wrong? Thanks in advance for any insight you can provide.
Are you also using the Facebook pixel on your site? I had the same problem and it turns out that the FB pixel code always triggers a gtm.formsubmit call.
Just add: Form URL - does not contain facebook.com/tr in your trigger.

Custom Event Not Firing in Google Tag Manager

I am trying to fire a custom event in Google Tag Manager for a Virtual Page View. I want to be able to track a conversion in a dynamic shopping cart page where the actual URL does not change.
I added the following code for a dataLayer and set it up to fire when the event= VirtualPageView but it's not working.
Any ideas?
dataLayer.push({
'event':'VirtualPageView',
'virtualPageURL':'/thankyou',
'virtualPageTitle':'Thank You'
'conversionValue':'value'
'currencyCode':'currency'
});
Google Tag Setup
Custom Event Setup
Looking at your code I see a lot of missing commas after everything but the second line. This will cause the JS to fail which means no event is pushed into the dataLayer which means GTM won't see anything happening and therefore not fire any tags.
I.e. add a comma after 'virtualPageTitle':'Thank You and after 'conversionValue':'value'. Keep in mind that if you actually pass 'value' as a string and an AdWords Conversion Tag looks for a float, it will fail that tag.
GTM is fairly finicky and will just stop execution when JS code related to it fails.

Google Tag Manager and Single Page apps

I'm trying to integrate Google Tag Manager with my Ember app. I'm having a hard time understanding how to notify GTM that the page changed, and send a page view event.
I've read a lot of things online, mostly working around creating a new variable for a "virtual page" or something, but obviously this is far from ideal.
I'd like to be able to just use dataLayer.push to notify the page actually changed. Is there an easy way out I didn't find or is it really a pain to track with GTM on SPA?
This was asked quite a while ago. With the current feature set of GTM, you can easily set up SPA page tracking without much trouble.
First, go to Triggers and create a new trigger. Select History Change as the trigger type. This will create a trigger that fires every time the location history changes.
Then create a new Tag of Universal Analytics type and set it up as per the screenshot below.
[
As for the trigger, set the previously defined History Change trigger, and you're done. Every time a navigation occurs in your SPA, a page view event with the proper page path will be triggered.
EDIT: as trognaders pointed out in a comment, this does not track the initial page view. To remedy, simply add an additional trigger for your tag that fires on the Page View event (All Pages). See screenshot below.
You definitely need to push events into the dataLayer which you can then trigger a GA page view tag in GTM. So to push an event into the DL:
dataLayer.push({'event':'virtualPageView'});
Then setup a trigger called 'vpv' which fires on a custom event called 'virtualPageView'. Add that trigger to a GA tag.
The best thing to do is also send through the details of the virtual page when you send the event. This way you can set up variables that pull these dataLayer property values into the page view call. So you might do this:
dataLayer.push({
'event':'virtualPageView',
'page':{
'title':'contact us',
'url':'/contact'
}
});
So you'd setup a variable called 'DL- page title' (for example) which is a dataLayer value of 'page.title' and another variable called 'DL - page url' which is a dataLayer value of 'page.url'.
You then setup a new Universal Analytics tag which has all your usual pageview settings but with 2 'Fields to Set' (under More Settings). Set 'title' to {{DL-page title}} and 'page' to {{DL - page url}}
Finally set the trigger to 'vpv' and you'll find everytime you push the event + data into the datalayer you'll get a pageView fired off with your virtual page's title and virtual url.

DataLayer Query Google Tag Manager

Where should I put dataLayer creation code in the page? Is it mandatory to put it above the GTM snippet?
Where should I call the dataLayer.push() function? Should it always be put in the code were the dataLayer creation code is placed like below?
<script>
dataLayer=[{‘Pcategory’:’login’,‘Pno’:1}],
dataLayer.push({‘Pcategory’:’login’,Pno:1});
</script>
Is it mandatory to declare an event for each dataLayer we push?
Is it mandatory to declare the dataLayer before we call dataLayer.push() function or does GTM provide a built in dataLayer?
Where should I put the code below? If I want declare it, how can I do it?
Click Here...
You need to initialize the dataLayer above the GTM snippet. You need to put all information there that is supposed to be available on page load (the GTM snippet on page load can only access stuff that preceded the tag managenemt script). If you do not need custom data on page load the dataLayer might be empty. You still need to declare, else the push later on will fail.
You use a push when you want to add data after page load, e.g. if you want to respond to user interactions.
You do not need to add custom events to clicks or form submissions, since GTM has what's called auto-eventhandlers (i.e. the necessary javascript to respond to clicks is already part of the GTM script).
You need a custom event if you want to trigger tags on user interactions that are not clicks or form submits (or timers). E.g. if you run a javascript function and you need to trigger tags dependening on the result the function can push a custom event per possible result to the dataLayer, and you can fire tags accordingly.
For your example you might, for example, set up a click based trigger; if the link text is unqiue you could set the a pageUrl Variable based on the link text (which is automatically available via the {{Click Text}} variable if you use a click trigger). So for that example you would not have to use any custom code at all, you can simply use what GTM provides.

Resources