Google Analytics - Tracking on exit page - google-analytics

i have a from on my page and on submit i will track the submit event. i must on submit goto the other page on a other server. how can i track the submit click before the page change?
Do you have an idea?

You're going to want to use an "event" to track either the mousedown of the submit button and/or a "enter" keypress
// submit button
jQuery('#keyword-submit').bind('mousedown', function (event) {
_gaq.push(['_trackEvent', 'onsite search', search_keyword]);
});
// textbox
jQuery('#searchKeywords').bind('keydown', function (event) {
if (event.keyCode == 13)
_gaq.push(['_trackEvent', 'onsite search', search_keyword]);
});

Related

Datalayer not getting push on click event?

I m having trouble pushing datalayer to gtm on click event. But datalayer gets properly pushed on a load of the page but not on click. below is my code
$('.load-test-div').on("click", function () {
//console.log('Called properly');
dataLayer.push({
'event': 'display more',
});
});
I have manipulated code in a different way still it's not pushed. For testing, I m using the "Tag Manager" addon of chrome. Is there are any setting to capture click event in google tag manager. Please help!
Without seeing more I can only guess.
For example, this works: https://jsfiddle.net/emo38rbv/
dataLayer = window.dataLayer || [];
document.querySelector('.load-test-div').addEventListener('click', function(){
dataLayer.push({
'event': 'display more',
});
alert('this has pushed to the dataLayer: '+JSON.stringify(dataLayer[dataLayer.length -1]));
});
The issue could be:
Your function is being called before jquery is loaded.
The dataLayer hasn't been declared
The DOM is not ready (the query selector can't find the element)
The element does not exist at the time you run your function

Displaying Form pop up on Click of add to cart button in Woocommerce

I want a pop up contact form to be displayed (if user is not registered) on click of add to cart button. The pop up form will take all the details of the user. On click of submit button of form , mail should be sent to the user consisting of the information of the respective product plus mail should go to wordpress admin.
You have to do like this.
<script>
jQuery('.add_to_cart_button ').click(function(e) {
e.preventDefault();
var ProductId = jQuery(this).data("product_id")
addToCart(ProductId);
return false;
});
function addToCart(ProductId) {
//show popup for fet user details in popup
// process user data
}
</script>

Google Analytics event tracking -Contact Form Submit

I am trying to track when a user clicks on the submit form button and they send contact information. I have this code on the contact page:
<input type="submit" value="Send" class="btn big btn_submit_form" onClick="ga('send', 'event', { eventCategory: 'Contact', eventAction: 'Information Request', eventLabel: 'Contact Form'});">
I am using Universal Analytics.
In my Google Analytics account, I have the goal description Name as Contact Form Submit, and the Goal Type is Event. The event conditions are as follows:
Category -Equals to- Contact
Action -Equals to- Information Request
Label -Equals to- Contact Form
with the Value field being left empty.
I have "Use the Event value as the Goal value for the conversion" set to yes.
However, Google Analytics doesn't seem to be tracking the event. Any idea how to fix this?
Thanks.
The most likely problem here is that your page is being unloaded before the event hit has time to send. When you submit a form on a web page, most browsers will stop executing JavaScript and start loading whatever new page the form's action attribute is pointing to.
The general workaround for this is to call preventDefault on the form's submit event, wait for the hit to successfully send to Google Analytics, and then manually re-trigger the form submit.
Here's how that might look (note: I'm using jQuery for simplicity):
$('#my-form').on('submit', function(event) {
// Prevent the browser's default form submission action.
event.preventDefault();
ga('send', 'event', {
eventCategory: 'Contact',
eventAction: 'Information Request',
eventLabel: 'Contact Form',
hitCallback: function() {
$('my-form').trigger('submit');
}
});
});
The key part in the above code is the hitCallback function, which gets invoked when GA returns success from the event hit beacon.
Maybe try changing the event to the form submit, instead of the button click:
<form onSubmit="ga('send', 'event', { eventCategory: 'Contact', eventAction: 'Information Request', eventLabel: 'Contact Form'});">
The form can be submitted in ways other than the clicking the submit button (for instance pressing enter in an input field)
Also, in my experience, the tracking will post correctly almost every time, even when you do not call preventDefault on the event.

Event and Goal, Click on e-mail button

I would like to know how many visitors clicked on a specific e-mail button. I have added the following to the button link:
[button size="large" link="mailto:mailadress" button onclick="ga('send', 'event', 'button', 'click', 'name button', 'mailto:mailadress'] Text[/button]
And in my analytics panel I go to Admin>>Goals>>New Goal>> give it a name and chose Event option and then added category: button, action: click, and Saved.
It is still not working. Is something wrong with my code? It is a WordPress website. Do I need to add anything extra?
First, there is a syntax error with your button. The onclick event and ga function is not closed. It should look like this:
[button size="large" link="mailto:mailadress" button onclick="ga('send', 'event', 'button', 'click', 'name button', 'mailto:mailadress')"] Text[/button]
As Eike Pierstorff mentioned, it looks like you're using a shortcode to output the button. If the shortcode does not support an onclick attribute, it will not print it in the final HTML code even if you fix the syntax.
You can check the output in Chrome by right-clicking on the link on your site (the front-end, not the admin area) and clicking Inspect Element. If you don't see the onclick attribute in the HTML code, the shortcode is not printing it.
You can check if your shortcode supports a class or id attribute, then use that attribute as a selector in your own Javascript.
jQuery(document).ready(function ($) {
if ( typeof( ga ) != 'undefined' ) {
$('#your-id').on('click', function() {
ga('send', 'event', 'button', 'click', 'name button', 'mailto:mailadress');
});
}
}
To implement this, you'll need to know how to write and enqueue JavaScript.

Event Tracking for Newsletter Sign Up

I want to track how many people sign up for Newsletters. I can do it with event tracking in Google Analytics. But there is an issue. I found the below code on the button
<form name="ccoptin" action="http://visitor.r20.constantcontact.com/d.jsp" target="_blank" method="post" onsubmit="return SubscribeValidate()">
Then where I have to place the following code
onClick="_gaq.push(['_trackEvent', 'newsletter signup', 'email', 'Sidebar',, false]);"
onClick is tracking for buttons. For forms, add the code into a successful "validate" function and/or on the "thank you" page.
var SubscribeValidate = function () {
// Make sure the form is filled out
if ($("#email").text() != "") {
return false;
}
// Track in Google Analytics
_gaq.push(['_trackEvent', 'newsletter signup', 'email', 'Sidebar', , false]);
window.location = "/thanks"; // or $("#modal").modal();
}

Resources