Has anyone figured out how to only increment share counts if the sharing action is completed?
They seem to count clicks.. not completed shares. That isn't a stat that is profoundly meaningful to me.
You can set it so the count displays the 'native' count:
<script type="text/javascript">stLight.options({
publisher:"Your publisher key", nativeCount:true
});</script>
However this only seems to work for Facebook, LinkedIn and a few others. For Twitter, I just replace the ShareThis count with the actual count obtained from the Twitter API, once ShareThis has loaded and the ShareThis markup exists on the page:
var pageUrl = 'http://www.google.com/';
updateTwitter();
function updateTwitter() {
if (jQuery('.st_twitter_vcount .stBubble_count').length > 0) {
jQuery.getJSON('http://urls.api.twitter.com/1/urls/count.json?url=' + pageUrl + '&callback=?',
function(data) {
jQuery(".st_twitter_vcount .stBubble_count").html(data.count);
});
}
else {
setTimeout(function() {
updateTwitter();
}, 50);
}
}
Just change the pageURL variable to the URL you want to display statistics for.
Hope that helps,
Kamal.
Ended up rolling my own. Neither seems to support this.
Related
This question already has an answer here:
Facebook ignoring OG image on first share
(1 answer)
Closed 6 years ago.
First of all hi and thanks in advance to anyone who can help with this because I've been going crazy over this for weeks now.
So I've got a website which lists gif taken from my mobile application (which are then stored on AWS and my visitors ( I haven't found a use for me to have users) can share these gifs on facebook using the facebook sdk.
The problem appears when I try sharing an image for the first time
This is what the share dialog shows the first time I click on my sharing button:
http://i.stack.imgur.com/lNVNF.png
and then I close and reclick the same button and now it works:
http://i.stack.imgur.com/YsDUm.png
Now I've been trying to find a way to make this work on the first sharing attempt but to no avail.
I am using meteor in combination with biasport:facebook-sdk and Amazon S3 for the hosting of my files.
Edit here is the code used:
FRONT SIDE
HTML
<div class="facebook share">
<img src="/gallery/fb.png">
</div>
Javascript
Template.*templateName*.events({
'click .facebook': function(e){
e.preventDefault();
e.stopPropagation();
// this is in a modal so I store the data I need
// (events have photos which in turn contain a url to the gif
var url = Session.get('event').photos[Session.get("id")].url;
FB.ui({
method: 'share',
href: url
});
}
SERVER SIDE
JAVASCRIPT
if(Meteor.isClient) {
window.fbAsyncInit = function() {
FB.init({
appId : 'APP_ID',
status : true,
xfbml : true,
version : 'v2.5'
});
};
}
Edit: I found a manual solution using exec future and curl
so first I added a call to a meteor method on the share that updates the facebook crawler
JAVASCRIPT
Template.*templateName*.events({
'click .facebook': function(e){
e.preventDefault();
e.stopPropagation();
// this is in a modal so I store the data I need
// (events have photos which in turn contain a url to the gif
var url = Session.get('event').photos[Session.get("id")].url;
Meteor.call('updateCrawler', url, function(){
FB.ui({
method: 'share',
href: url
});
});
}
Then I defined my meteor method as such
JAVASCRIPT
Meteor.methods({
updateCrawler: function(url){
var future = new Future();
cmd = 'curl -X POST -F "id=' + url + '" -F "scrape=true" -F "access_token={my_access_token}" "https://graph.facebook.com"';
exec(cmd, function(error){
if (error){
console.log(error);
}
future.return();
});
future.wait();
}
});
it's ugly but since I'd have to wait for the crawler to update and it works I'll leave this here for future use for someone maybe
Edit2:
I did not use og tags at all since I was simply sharing a url to aws directly and not a url to my website
I worked around this problem by calling the Facebook API direct from the server to make it scrape the og data by requesting info on the page. First time round it doesn't have the image cached but second time it does so this workaround does the initial call before sharing.
Use an access token for your facebook app and call the below in an ajax call and await the response before opening share dialog. Replace Google address with your own uri encoded address https://graph.facebook.com/v2.5/?id=http%3A%2F%2Fwww.google.co.uk&access_token=xxxxx
EDIT:
As per comments, here is my server side method for calling this which I use when posts etc are inserted to make the initial call and prompt a scrape from fb:
var getTheOGInfo = function (link)
{
if (!link || link.slice(0, 4).toLowerCase() != "http"){
throw new Meteor.Error("og-info-bad-url", "Function requires an unencoded fully qualified url");
return false;
}
var url = "https://graph.facebook.com/v2.5/{{{{id}}}}?access_token={{{{token}}}}&fields=og_object{id,description,title,type,updated_time,url,image},id,share";
var token = Meteor.settings.private.fb.token;
if (!token){
throw new Meteor.Error("og-info-no-token", "Function requires a facebook token in Meteor.settings.private.fb.token");
return false;
}
var link_id = encodeURIComponent(link);
url = url.replace('{{{{token}}}}', token).replace('{{{{id}}}}', link_id);
var result = HTTP.get(url, {timeout:1000});
return result;
}
Or for your purposes you may not want anything that might be blocking so you could change the last two lines to be aynchronous:
var result = HTTP.get(url, {timeout:1000});
return result;
//Replace with non blocking
HTTP.get(url, {timeout:1000}, function(err, result){console.log('something asynchronous', err, result);});
return true;
My current code pops up a warning box window telling the user that he or she is using IE. But is there a way to direct them to Firefox website?
public static boolean isIEBrowser()
{
return (Window.Navigator.getUserAgent().toUpperCase().indexOf("TRIDENT") != -1);
}
if (isIEBrowser())
{
SC.warn("It looks like you're using a version of Internet Explorer." +
" For the best GUI experience, please update your browser.");
}
Sure!
This might be more of what you're looking for.
String site = "http://www.mozilla.org/en-US/firefox/new/";
Window.Location.assign(site);
Window.Location.reload();
You can also add a simple timer that redirects them after a certain number of seconds or a button that takes them directly to the site.
edit:
Or... you can do this in pure javascript
JS:
function changeURL(site) {
window.location.href = site;
}
HTML:
<script>
changeURL('http://www.mozilla.org/en-US/firefox/new/');
</script>
I've looked at this Check if Facebook is blocked then redirect to try and help me solve this problem.
I have a web page that has an iframe in that contains my tumblr page. What I want is if someone is at work and social networking is blocked it won't try and load the tumblr in the src of the iframe but load my own page tumblr.htm instead.
so I got this far and realise I don't know what I'm doing really.
function isSiteOnline(url,callback) {
// try to load favicon
var timer = setTimeout(function(){
// timeout after 5 seconds
callback(false);
},5000)
var img = document.createElement("img");
img.onload = function() {
clearTimeout(timer);
callback(true);
}
img.onerror = function() {
clearTimeout(timer);
callback(false);
}
img.src = url+"/favicon.ico";
}
isSiteOnline("http://www.tumblr.com",function(found){
if(found) {
// site is online
window.location.href = 'http://my_page.tumblr.com/';
}
else {
// site is offline (or favicon not found, or server is too slow)
window.location.href = 'tumblr.htm';
}
}
Would this work and what would I put in the src of the iframe tag? would it be src="isSiteOnline" ? and that's where the problem is there are several others on one page (twitter etc.) so I'm fighting a losing battle through lack of experience. Can anyone help?
http://developers.soundcloud.com/docs/api
When I look at the API docs, I see
SC.stream("/tracks/293", function(sound){
sound.play();
});
When I look at the track I uploaded, it only provides me the permalink. How do I get the track ID from the website? Do I always have to do a /resolve to get the ID?
This is probably more manual steps than /resolve, but it is "from the website." The sound id also appears in the embed code when you go to the sound and click "Share".
For example, if you go to a sound page, e.g.:
https://soundcloud.com/lowcountrykingdom/another-ordinary-day
Then click "Share", which brings up a pop up. Click "Embed" to switch to the embed tab, and copy the Embed code, which will look something like:
<iframe width="100%" height="166" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/47580057&color=ff6600&auto_play=false&show_artwork=true"></iframe>
Note the ID in the value of the url query parameter:
url=https%3A//api.soundcloud.com/tracks/47580057
I'd use jquery ajax call to grab the data from Soundcloud. Say you save your variables permalink_url and client_id:
$.get('http://api.soundcloud.com/resolve.json?url='+
permalink_url+'/tracks&client_id='+client_id , function (result) {
console.log(result);
});
This should log an array of the songs. Check out this bin for reference http://jsbin.com/viviza/4/edit
Update: This answer is pretty old.
Soundclick docs https://developers.soundcloud.com/docs/api#uploading
The SC object now allows for getting the id's directly
SC.connect().then(function(){
return SC.get('/me/tracks');
}).then(function(tracks){
return tracks.map(function(track){
console.log("you can log the id here too: " + track.id")
return track.id
})
})
You could also get all the tracks from a given user id. Then use $.map() to place each of the tracks into an array. Call SC.stream() with song[i].id to play a random song from the array from the array of tracks.
SC.get('/users/123456/tracks/', function(tracks) {
// get an array of tracks
var song = $.map(tracks, function(i){
return i;
});
var i = Math.floor(Math.random() * song.length) // get a random value between 0 & the of songs in SC account -1
SC.stream(song[i].id, function(sound){
sound.play();
});
});
Using JavaScript to find the track data from a soundcloud song url:
let trackUrl = 'https://soundcloud.com/user-869590724/talk-to-animals-sentra-remix'
let client_id = '<your-client-id>'
let resolveUrl = `http://api.soundcloud.com/resolve.json?url=${trackUrl}/tracks&client_id=${client_id}`
fetch(resolveUrl, {
method: 'get'
}).then((response) => {
return response.json()
}).then((result) => {
/* now you have the track */
console.log(result)
})
Via the Facebook javascript API, you can subscribe to the 'event.create' event to listen for when users "Like" something on a page via the Like Plugin. Is it possible to respond to the same user un-liking it as well? I don't see any events documented, wondering if this is a hidden feature.
You can now subscribe to the “edge.remove" event to know when a user unlikes a page. For example:
FB.Event.subscribe('edge.remove', function(href, widget) {
alert('You just unliked '+href);
});
Announcement: http://developers.facebook.com/blog/post/446/ documented at http://developers.facebook.com/docs/reference/javascript/FB.Event.subscribe
Recently added:
http://bugs.developers.facebook.net/show_bug.cgi?id=10796
The javascript sdk does not have an event for this. I have run into this problem before. The only way to check if a user has unliked an item is to do a Graph or Rest query to determine if they currently like the item.
Unfortunately "edge.remove" won't get triggered when you dislike a facebook-page via "liked"-button (on the top right) and click on "unlike". -.-
This event is very useful to create a vote system. The js-script below does an ajax-call to a PHP-page that updates a database.
var _paq = _paq || [];
FB.Event.subscribe('edge.create', function(response) {
var page = $("#pageid").val();
$.post("ajax_vote.php", { page: page },
function(data) {
//alert("voted : " + data);
});
});
FB.Event.subscribe('edge.remove', function(response) {
var page = $("#pageid").val();
$.post("ajax_unvote.php", { page: page },
function(data) {
//alert("unvoted : " + data);
});
});