I'm trying to add event tracking to my two buttons, but my button code looks like the following. I'm popping the user down to the section they clicked and hiding the other button's section:
<button class="btn btn-primary btn-lg" onclick="$('#order-form').show();$('#digital-download').hide();location.href='#Print'">
Order Print
Version
</button>
Anyone know how would I add the GA tracking code?
// Form Tracking for Google Analytics
$('.form-track').click(function(e){_gaq.push(['_trackEvent', 'Form', 'Completions', 'Form_'+$(this).attr('title')+'_'+location.href]); });
You can try something similar to this, adding the following code to your buttons:
$('.btn.btn-primary.btn-lg').click(function(e){
ga('send','event','your_category', 'your_action',$(this).text().trim());
})
When the button is clicked, it will send the event with your specified category, action, and the button text as the label. Note that you are using UA, so the event tracking syntax in your example is incorrect.
Related
I am building an advanced search form, and upon submit of criteria it brings back search results.
I wanted to implement a page loader for this, so on submit it then triggers the loading of the page
This tutorial works for the page itself
https://www.w3schools.com/howto/howto_css_loader.asp
Can anyone help me make this work when the submit button is clicked instead?
You can use JavaScript to show your loader when your submit button is clicked by adding at to the button directly
<input type="submit" onclick="document.getElementById(ID_OF_YOUR_LOADER).style.display='initial';">
or in a separate script-Tag:
<script>
document.getElementById(ID_OF_YOUR_SUBIMT_BUTTON).onclick=function(){
document.getElementById(ID_OF_YOUR_LOADER).style.display='initial';
}
</script>
Your loader would look like this:
<div id="ID_OF_YOUR_LOADER" class="loader" style="display:none"></div>
I have 10 link buttons on my web page. Each button pertains to a unique city. Each link button has an id attribute containing the name of the city. Each link button contains an onclick event which is recorded/tracked in Google Analytics Event Tracking. However, I haven't figured out how to capture the location from the unique id attribute. See example code below.
In short, I want to dynamically capture the value of the id attribute of the <a> tag as the Event Label in Google Analytics? FYI: In the code below, the Event Label is sending event.target.href to GA. This is where I want to capture the id value.
Here's the code:
<a id=“location-city-example” onclick=“ga(‘send’, ‘event’, ‘button’, ‘click’, event.target.href);” href="/apply" class="btn btn-rj">apply now</a>
Mmm... I think this would work
onclick="ga('send', 'event', 'button', 'click', this.id);"
Note that I would stick to using "straight" quotes rather than the "smart" quotes as in your original code. The latter does funny things sometimes.
I have a button
<button data-z="myvalue">
click
</button>
which clicks i want to track in Google Analytics (Universal - analytics.js).
I try it with
<button data-z="myvalue"
onClick="ga('send', 'event', 'clickout', 'buttonclick', window.location.href, getAttribute('data-z'));>
click
</button>
With window.location.href i get the current URL (work), and with getAttribute('data-z') i want to get the myvalue from data-z (doesn't work).
Any help is appreciated!
PS: JQuery based solutions are welcome!
You are not telling your getAttribute method to which element the attribute belongs - getAttribute does not exists on its own, it is a method of a DOM object (your button in this case).
Since you are using inline Javascript the DOM object will be available by using the "this" keyword in the click function to call the getAttribute of the button:
<button data-z="myvalue"
onClick="ga('send', 'event', 'clickout', 'buttonclick', window.location.href, this.getAttribute('data-z'));>
click
</button>
Much less expensive than jQuery selectors (however using jQuery you could dispense with inline scripts and attach the click in an javascript function. Mixing HTML and JS is not elegant).
One possible solution, using jQuery, would be to evaluate for the the clicked element first to acquire the attribute value, and then pass that into the onclick handler:
onclick="var d=$(this).data('z'); ga('send', 'event', 'clickout', 'buttonclick', window.location.href, d);"
In Google Analytics I have set up a Goal for a button to be pressed on a sign up contact form. It is to collect email addresses for a mailing list. The problem is that it does not work. I have followed three guides on this offering slightly different code for alternate approaches but have not got it to work.
In GA the Goal is setup as follow...
Goal setup: Custom
Name: Contact
Type: Event
Category Equals to Contact
Action Equals to signup
GA is tracking the page and analytics from users can be viewed so we can see it is working. We are using CloudFlare and GA is added on the fly to all pages served through their cloud.
The code for the button is below.
<button type="submit" onclick=”_gaq.push([‘_trackEvent’, ‘Contact’, ’signup’])” class="btn btn-success">Sign up</button>
Any help on this would be appreciated.
If that is the exact code you are using for the button, then at least you would need to change the smart quotes (ie. the angled quotes) to straight quotes, so it should look like this:
<button type="submit" onclick="_gaq.push(['_trackEvent', 'Contact', 'signup'])" class="btn btn-success">Sign up</button>
I believe there are issues when the smart quotes are used.
The developer who made a site we're working on has buttons linking to PDF downloads using:
<button onClick="document.location.href='doc.pdf'"> Doc Name </button>
However, we also need to track events for these (we don't want to inflate pageviews with PDF downloads), using:
<button onClick="_gaq.push(['_trackEvent', 'PDFs', 'Download', 'Doc Name']);""> Doc Name </button>
So, the issue is, how can I do GA event tracking without having the two requisite 'onClick's conflicting?
I was thinking about triggering the GA Event with 'onMouseDown,' but this would be less accurate, no?
Many thanks in advance.
<button class="download-pdf" onclick="document.location.href='doc.pdf';_gaq.push(['_trackEvent', 'PDFs', 'Download', 'Doc Name']);"> Doc Name </button>