I'm used to track clicks on elements on my web app using Google Tag Manager (a trigger to detect a click on an element with a specific ID, and a tag to send an event to GA4 when that trigger is detected).
Now I have an element that can be dragged and dropped. What's the easiest way to track drag and drop actions on elements?
Thanks!
Related
On my blog, I have a related content section and I want to track which images get the most clicks.
I'm using Google Tag Manager which already triggers an event in Google Analytics when a post in the related content is visible and then clicked, but I can't manage to pass through the image ID to Google Analytics as a Custom Dimension for reporting.
How do I add this value as it's own data layer variable?
I've tried adding a custom event but this creates a new event, but I want to add the ID to the click event or the element visibility event.
I have a question about user properties in Google Analytics 4.
I created 2 events:
The first one is called custom_session_start and it is triggered every time new session started.
The second is called UI_Interaction which is event that triggers every time that the user is clicking on something in the website.
The custom_session_start has some user properties and event parameters his specific tag in GTM.
The UI_Interaction event has only event parameters in his specific Tag.
From what I know the user property should be save unless I change it manually, so if I created some user properties in custom_session_start they also should be appear in UI_Interaction.
However, when I create a report in GA4 the user properties are only set in every custom_session_start event and they are empty in UI_Interaction event.
Is there a way to keep them also when the UI_Interaction occurs?
In GTM, I'm trying to trigger on page text that's visible after a form is submitted since it does not change to another URL or refresh the page i.e. #bxAddSuccessTitle. However, the summary of events in GTM only capture the Click elements from the DataLayer. I've tried DOM, Custom JS variables, Window Load/Page View triggers and nothing populates until I click on the page.
Is there a workaround where I can trigger on something that is visible in the page source, but not necessarily in the datalayer?
enter code hereConfirmation Page
enter code hereConfirmation Page Source Code
enter code hereGTM Summary of Events
Sounds like you need a visibility trigger, probably with the "observe DOM changes" option active.
This will fire when an element comes into the viewport either by scrolling, when it is unhidden via css or, with the "observe DOM changes", when the element is created/inserted dynamically after a user interaction.
A possible caveat is that the trigger will only fire when the element is visible to the user (unhiding or inserting below the fold will not activate the trigger).
I'm trying to create an Auto Event Tracking tag in GTM. However, I can't find Event Listener option under product types. You can see the screenshots of two tags with and without Event Listener.
What am I missing?
Thanks for helping out.
Are you wanting to fire a tag based on an event that occurs? From the looks of your tag name, Link Click Listener, you'll want to create a trigger that matches your criteria and then apply the trigger to the tag(s) you are creating. You needed to create event listeners in older versions of GTM, but the newer versions will automatically listen to link clicks. More info on auto-event triggers can be found here.
click listener trigger screenshot
I have been able to capture and push URL's with the Google Tag Manager default, but I have been having trouble trying to push custom data layer attributes.
For example:
Before the GTM script loads I push the current page url into the dataLayer.
<script>
var currentPage = (document.URL);
dataLayer = [{
'pageURL': currentPage
}];
</script>
And then on various elements I'm pushing content to the dataLayer when they are clicked:
<a id="tracking-image" href="#" onclick="dataLayer.push({'#elementID': 'tracking-image'});"></a>
I've been having trouble capturing these in GTM / Google Analytics. Ultimately I would want in captured in Google Analytics like so:
Label: currentPage
Action: tracking-image
But currently it's just tracking the gtm.js event firing multiple times.
You do not need to push the element id to the datalayer (GTM can read the id by itself). What you are missing is an event to trigger your tag.
"Events" in GTM are not related to event tracking in Analytics and only vaguely related to native Javascript events. "event" is a reserved macro name, and it's purpose is to trigger tags; there are some pre-defined events on page load start (gtm.js) , page load finish (gtm.dom) etc.
If you want to trigger a tag that does not fire on page load chances are that you need a custom event.
One way would be to change your code like this:
<a id="tracking-image" href="#" onclick="dataLayer.push({'event': 'imagetracker'});"></a>
Then you could set up a rule with the condition "{{event}} equals imagetracker" which you fire your tag.
Probably a better way would be to use GTMs event listener tags. There is a link click event listener tag and a generic click listener tags. Since your link target is not a valid url I would choose the generic click listener. So you'd set up a new tag of the type click listener and have it fire on all pages. Now if an element is clicked the event macro will be assigned the value of GTM click.
Event listeners will also automaticall fill auto-event variables that hold various properties of the clicked element. This would allow you to access the clicked elements id though a macro called, somewhat unsurprisingly, "element id".
So you would create a rule where "{{event}} equals gtmClick" AND "{{element id}} equals imagetracker". That would fire a tag if the link is clicked.
Caveat is that GTMs event listener tags fail when there is already a click event on the element that returns "false" to suppress standard behaviour. Infos and workaround are and workaround on Simo Ahavas Blog (which is pretty much the go-to place for all things GTM-related).