Is there a way to catch the click event on the FourSquare follow button (https://foursquare.com/business/brands/offerings/followbutton) in order to add Google Analytics tracking with it?
Is there an API similar to the Twitter Tweet button and the Facebook Like button?
I couldn't find anything on the FourSquare site.
There doesn't appear to be comprehensive documentation of the Foursquare follow button, but I've been able to glean this much:
Unlike the Twitter and Facebook buttons, the Foursquare button is not in an iframe. That means you can capture clicks on it as you would clicks on any other element.
$("div[id^=fourSq_widget_id] a").click(function(){
_gaq.push(["_trackSocial", "Foursquare", "Click"]);
});
However, tracking this click doesn't mean anything; it doesn't tell you if the person followed through on the action of following, since that action takes place in a third party iframe.
There does appear to be an undocumented JavaScript API in the fourSq object for tracking the actual follow through on the action, but its not clear how to enable it.
It looks like it's something like:
fourSq.widget.Events.bind("follow", function(){
//do something
});
However, the only way I can seem to trigger it manually is with the accompanying trigger method. So, I'm not sure how to enable this undocumented JavaScript API so that it listens to actions taken in the modal window that pops up..
You could use Google Analytics Tracking feature, check this: http://code.google.com/intl/fi-FI/apis/analytics/docs/tracking/asyncUsageGuide.html
Related
I'm trying to add a button to my website that will add an event to my google calendar, I found this url:
https://calendar.google.com/calendar/r/eventedit?text=Your+Event+Name&dates=20140127T224000Z/20140320T221500Z&details=For+details,+link+here:+http://www.example.com&location=Waldorf+Astoria,+301+Park+Ave+,+New+York,+NY+10022&sf=true&output=xml
which works and it's really handy to configure, but I'm wondering, because when I click on it, it takes me to google calendar and it will never come back to my site.
Is there a possibility to add a some parameter to once the event is added, make google calendar redirect to my website?
Thanks in advance.
No there is not a way to do this. Your best bet is to have this link open in a new tab/window so that the user still has your site open.
Another option is to use the Google Calendar API if you're adding a lot of events for a user and have them authenticate. This way you can just use an API to add events and keep them on the page. I would not suggest this solution if you're just adding an event here and there as it's quite invasive to give calendar access to an application.
My website has a tel: link in the header, and I want to see in Google Analytics when this link is clicked, and on what page. I've decided to do this using Event Tracking in Google Tag Manager. So I made a tag, with the following configuration.
And this is my Trigger configuration.
This is the HTML that this is referencing, (note that I also tried to add an onclick attribute, which was meant to push Event data directly to analytics. This didn't work.)
This is the variable configuration used in this tag.
This is proof it fires in the GTM debug pane.
And this is the summary coming in when you click on the item withing the pane.
In Analytics, this is what I see in the Real-time events tracking.
And this is what I see under the events overview.
So the tag is firing correctly, but the information is not going over to Analytics. I can find no resource on the internet that addresses this issue. Has anyone successfully pushed Google Tag Manager event tracking into Google Analytics? If so, what did you do to make it work, and what am I not doing/doing wrong that is preventing me from the result?
The end goal is I want to track the page where the click happened in Google Analytics' Events Overview, and also in the Goals section.
Thanks for that link, Uda! What was going wrong was my Google Optimize Tag. I paused all tags except my click-tracking and my Universal Analytics
I recently added the Google Classroom share button to my website. I'm looking to fire off a Google Analytics event every time this share button is clicked. I've tried using a javascript onClick to do it, but that didn't work. I think it might be because this creates an iframe when rendered by the browser.
$('#___sharetoclassroom_0').on('click', function(e) {
ga('send', 'event', 'gClassroom', 'gClassroom Click', 'Google Classroom Clicked');
}
I then saw the "data-onsharestart" attribute I can add to the Google Classroom tag and tried using that. That didn't work either...
<g:sharetoclassroom url="URL" data-onsharestart="gClassroomCount" size="20"></g:sharetoclassroom>
function gClassroomCount() {
ga('send', 'event', 'gClassroom', 'gClassroom Click', 'Google Classroom Clicked');
}
Any ideas on how I could add this event to the Google Classroom Share button?
You should try to use the debug version of the analytics.js library, that logs detailed messages to the Javascript console as it's running. These messages include successfully executed commands as well as warnings and error messages that can tell you when your tracking code is set up incorrectly. It also provides a breakdown of each hit sent to Google Analytics, so you can see exactly what data is being tracked.
Based from the blog, if you want a full control of the appearance and behavior of the share button (and don't need the callbacks), you can customize the Classroom icon as long as it still meets our branding guidelines and initiate the share via a URL of the form: https://classroom.google.com/share?url=https://foo.com/
You can also check this related SO question, hope it helps!
On a website, I have some social buttons (tweet, facebook like, google+1, ..). Most of them are inserted using an iframe.
The task is to track use interaction with those buttons: if someone +1'ed the content - and AJAX request should update my local statistics on the server.
However, with JS I can't access the contents of the iframe due to security restrictions: can't bind 'click' event.
How do I track clicks on those social buttons, then?
Possible solutions:
Bind 'click' to the iframe object itself: it does not work.
Add buttons inline, w/o an iframe. No go: I should also display the number of likes for every button.
Try to use Social Service APIs to insert without an iframe. Not all services support this.
You can't. If you could catch clicks on them you could also trigger clicks on them which would be pretty bad (imagine porn sites making you "like" them automatically).
The only thing you can do is using the APIs of the various sites to retrieve the number of people who liked/+1'd/etc. your site.
Most of the social buttons from the main companies enable your Javascript to detect when the button has been pressed. They usually do this via Javascript events.
In other words, they'll tell your code that they've been pressed, you don't have to detect it on your own.
Twitter
info on their javascript events
Facebook
You need to use the XFBML version of the button. From the Facebook Like button FAQ
How do I know when a user clicks a Like button?
If you are using the XFBML version of the button, you can subscribe to the 'edge.create' event through FB.Event.subscribe.
Google +1
See the callback parameter in their docs. See section +1 Tag Attributes. You provide a Javascript (JS) function to their button. Your JS is then called by them when the button is pushed. Easy!
The description of the issue is, if we want to add tracking function to FB & Twitter button, we have to use XFBML method to develop the FB button(please refer to http://developers.facebook.com/docs/reference/plugins/like/ ), because only XFBML method is supported to use Facebook’s Api to catch the click event on facebook like button(no matter which method we use to develop the buttons, the buttons always will be put into an iframe in HTML, the elements in iframe are different domain from our site, so we are not able to control the element in iframe, Facebook & Twitter offer some Apis which can be used to develop and control the buttons, but these Apis only can be called by using XFBML method.), we try to use the Facebook api FB.Event.subscribe (please refer to http://developers.facebook.com/docs/reference/javascript/FB.Event.subscribe/ see the detail) to catch the click event on facebook button and enable the tracking, it worked and the tracking value can be returned successfully, but our issue is: if we use article & gallery page (article & gallery contain FB & Twitter button),also use FB & Twitter button on NetworkHeader, like this:
If we click the button on header, it will call tracking function and send tracking value, but after clicking the button on header, then click the button in article or gallery, it won’t return any tracking value, our question is: we are not able to differentiate the relative tracking value on header or article, which mean if we click the button on header, it will call FB.Event.subscribe and enable tracking function, but in the same HTML, the button on article also will run the FB.Event.subscribe, although we use independent JS file which is only for FB & Twitter button on header, we are not able to control or modify the Api from Facebook or Twitter, no matter which button(in article or on header) we click, it always will call the first JS file loaded which contains FB.Event.subscribe function, the other Facebook button in the same HTML also will run the function, that mean if we click the other FB & Twitter button in article or gallery, the tracking value is wrong, it will return header button’s tracking value.
Are you able to do me a favor if there is any way to resolve this issue?
Thanks,
Ivan
I've needed to do something similar on a project I've worked on, and this is how I did it.
Firstly the XFBML implementation of Facebook's social plugins isn't the only type that will fire events - the HTML5 version will also. I'd suggest using that version as..well HTML5 is just better markup.
So, the trick here is to provide a ref attribute as part of your element, such as:
<div class="fb-like"
data-href="https://www.facebook.com/"
data-send="false"
data-action="like"
data-layout="button_count"
data-width="150"
data-show-faces="false"
data-font="arial"
data-ref="header">
</div>
Then from within your FB.Event.subscribe function you can do the following:
FB.Event.subscribe('edge.create', function(targetUrl, elm) {
switch(elm._attr.ref) {
case 'header':
// tracking code
break;
case // ... etc
}
});