There's already a question similar to mine, but it doesn't tackle my problem.
I'm trying to set the google tag manager to track login events in my website.
But I can't identify the action related to the login event on the tag assistant.
Here is a print of the actions when I login:
None seem to be strictly related to the login event.
I tried to track some of these actions, but they occur in many other actions.
(thus, I collect data I don't need, as if they were login events)
What of these actions is related to the login event?
How can I precisely identify the login action ?
You can automatically implement data layer events on form submissions with ListenLayer.com. In this case, you will likely need to use their Custom Forms Listener.
You have to create an account, place their script on your website, enable the Custom Forms listener and it's features and then identify your forms under the Listener's event settings. You would do this by writing a simple rule to match the CSS class, ID, or form Name element etc. (these things would exist in the <form> tag.
Here you can see I have set some rules to identify a form like this
<form class="form-container"> or <form class="listenlayer">
Publish and test on your website.
Now, when the form is submitted, the Listener will automatically push data into the data layer identifying the form and the action.
From there you would use GTM to register and read the data layer activity. I assume you know how to do that since you have the GTM debug view going, but basically you'll get a new message on the left side with an event name and you can create a Custom Event trigger in GTM and also register Data Layer Variables to use in your trigger. It's all down hill from there!
With tracking you are usually left out with two approaches :
Either you ask your developer to implement a dataLayer event on a specific action / interaction so that you can then use this as a "custom event" trigger in GTM. For instance, here, on the login success page, after the GTM snippet, the developer could invoke the following code:
dataLayer.push({ event: 'login' })
That will allow you to use 'login' as your event name in GTM custom event trigger.
As you began doing, if your developer cannot implement it, you may try to identify variables that will help you isolate that specific action / page. For instance here, maybe does your successful login page has a specific URL you could use in a page view event, targeting that specific page path.
Related
I was wondering if someone have had this type of issue when tracking form submissions from a hubspot form.
To give you some context, our client' site is an SPA and has x3 different Hubspot form.
The solution I applied to track form submissions was to create a Custom HTML HubSpot Success Listener Tag, and then I created a look-up table to pass the form ID in a more friendly way.
The issue I'm having is that when I debug this implementation and subscribe to more than one form during the same session, the second submission duplicates:
I know I can configure the tag to fire once per event, instead of once per page. However, I don't want to lose the ability to count a second form during the same session because it's possible a user will want to fill out one form to receive information and another form to arrange a meeting.
Should I get the web developers involved to implement a dataLayer push for each form?
Thanks.
First, you want to debug your existing solution. You don't need GTM for it, though you can still use it. For the debugging, you will want to know what HS returns in their callback on form submission.
Just open your console, paste a listener that would show you the payload coming with it and inspect it:
window.addEventListener("message", function(event) {
console.log(event.data);
});
You will see something like this:
This indicates that we get three callbacks on form submission. You can listen for any of these.
Ah, looks like I'm getting the same form IDs that you have on your screenshot. Now, I'm not sure where that ID comes from. It's likely your developers and not HS are responsible for form IDs. I don't imagine HS could make such a trivial mistake. So ask the devs to change the form ids.
If they can't set unique ids for the forms, then yes, they will have to push custom events there.
I have a hybrid app where the store is built on Webview the rest is native mobile. Users access the store via the menu button.
Since the store is web, I set up dataLayer variables where I have user information such as nickname, id, etc and also an ecommerce object where the items in the store are shown. I have also added dataLayer events such as view_item, process_purchase and purchase_completed.
I have integrated GA4 and GTM and I pass all dataLayer variables as event parameters so I can have organized.
The main problem is that, when users pay their order via card, they are taken outside the website to the payment provider solution, and then once the payment is finished, they return to the payment confirmation page where I set up the "purchase_completed" dataLayer event. This appears to break the tracking of the funnel, so sometimes purchase_completed event does not fire, or sometimes it fires but empty (no data on datalayer).
Is there a way I can fix this issue?
To me, your problem sounds rather shop related, than GTM related.
If your DataLayer.push event is malfunctioning (either empty or not firing at all), you need to your code.
GTM does not care for a funnel, if the dataLayer event fires and both trigger as well as tag are setup corretly, the tag is executed.
I currently have a form with a related articles element that suggests the user related articles upon filling the form subject.
I'm trying to catch all the form submissions where a related article has been clicked.
I've created 2 triggers and 2 tags:
The first fires once the user clicks on one of the related articles.
The second trigger fires once the user clicked on the form submission button.
I've also created a Trigger group that combines these 2 triggers, however, I'm having trouble with storing the clicked article text from the first trigger and using it in the tag.
Eventually I want to send to analytics the form subject and the clicked article text.
I know this can be easily achieved with dataLayer, but unfortunately, I cannot add any code to the site source.
Any ideas on how to implement this without using dataLayer ?
Since standard variables are frequently overshadowed by new events, you probably should rewrite what you want to keep with a new name in the dataLayer. You do not need access to the site source to do so as long as your GTM snippet does not restrict GTM from adding custom html tags (blocking tag types is possible, but rarely used.)
You can do custom html tags with variable references like:
<script>
dataLayer.push({importantclick:{{click element}} })
</script>
fired on one event and create a new DataLayer variable to retrieve importantclick at a later event on the same page.
(If for some reason you really can't write to the dataLayer, then using custom javascript variables, you can instead examine the contents of the dataLayer yourself to see contents that were overshadowed or write data elsewhere in the window environment to be fetched by another variable. But both of those practices are highly discouraged when working with javascript variables.)
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.
I'm trying to track form submissions by creating a data element and rule in Adobe DTM. I'm new to DTM and am having difficulty configuring the tag correctly. Here's a screenshot of my code: http://zeffective.d.pr/1hTHa. How should I create this rule in DTM to track email form submissions as an event in GUA (I've created a tool for GUA in DTM already).
There are several ways to do this (jQuery form submit, etc) but using an event-based rule should work just fine.
Something like this:
Event Type: Click
Element Tag or Selector: button.form-submit.disabled-submit // class name
Apply Event Handler Directly to Element
// Adobe Analytics Section
// Select s.tl (does not increment a PV)
// Set events or vars
You can also do this with a page rule that uses jQuery and listens for the form.submit.
Hope this helps.
Best way to set it up correctly is:
create event base rule,
chose event type click and check option delay link activation (this will avoid page reload before analytics call is made).
Apply event handler directly to element - leave this option unchecked.
Please do not set any other conditions as mentioned in comments above.
Choose analytics tool set s.tl and map your evars/props/events
Also, please check _sattelite.getVar("data element name") function to check that Data Elements are resolved properly.
Use browser addons like omnibug to check that calls are made as expected.
In section Javascript / Third Party Tags, for testing purposes you can add following java script:
console.log('new submission');
hope it helps.
If you have form validation happening I would not use an on click event in DTM. For form submissions, my preferred method is to use the form onsubmit handler and fire a direct call event to DTM after any other logic / validation happens.
_satellite.track('lead_form_submit');
Set up all your tracking logic in a Direct call rule that has a string to match what you pass to track. ie. 'lead_form_submit' or whatever you name it.