Facebook comments box api event call - javascript

I have Facebook comments box api on my webpage. So, I want to callback an alert function that when visitor comment on my webpage using Facebook comments book api visitor get the message or at-least the use will redirect to new page after comment. Is it possible? Because I never used this api before so I want help. Kindly let me know your solutions.
Regards
Code by Facebook:
(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s);
js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.5&appId=559989757482877";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
HTML by Facebook:
<div class="fb-comments" data-href="http://developers.facebook.com/docs/plugins/comments/" data-width="100%" data-numposts="6"></div>
I am Trying:
FB.Event.subscribe('comment.create', function(response) {
alert("Thank You.. Redirecting you now...");
// window.location = "http://google.com";
});

Related

Getting facebook page followers' count with Graph Api and Javascript SDK

I have django app and I need to show the number of followers of its facebook page.
In my base.html I have hardcoded the number of FB followers, but this is not a feasible longterm solution.
I've been experimenting with inline javascript, and this is the state of my code:
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'NumOfMyId',
xfbml : true,
version : 'v2.4'
});
FB.api(
'/MyWebSite',
'GET',
{"fields":"likes"},
function(response) {
console.log(response);
//here should go something so that the number of people liking the page gets appended to an html element by id;
});
};
(function(d, s, id){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
I need the facebook api to give me the number of followers, which is not a problem in the graph api explorer, but I have no clue how to accomplish it in my tag.
Any example/advice or redirecting to similar solved questions/issues/github project would be super appreciated!
~good vibes to y'all
If you're using jQuery on your page, you can do something like this:
<p>The total number of likes in my page is <span id="number-of-likes"></span>.</p>
function(response) {
console.log(response);
$('#number-of-liles').html(response.NUMBER_OF_LIKES_FIELD);
});
Where response.NUMBER_OF_LIKES_FIELD is the correct field name that has the number of likes.

how users can get data from my server as a bridge to facebook?

Please view this sample facebook share code:
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.0";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
The code acts in clinet area (It runs on user's browser).
In some countries facebook is filtered and you can not access it without an unti-filter...
Is there a way to call //connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.0 via server? not via user? I hope you underestand me. I want my server act as unti-filter...and user get data from my server as a bridge to facebook!
No. Even if it was that script will do other request to Facebooks servers to get information. If Facebook is blocked it will not work

Integrating Facebook & Twitter buttons with InstaClick

So today I found this awesome piece of code that instantly made my website faster. Actually, any link clicked became almost instant. It's called InstaClick (http://instantclick.io/). I installed it and everything worked great ..except that Facebook Like and Twitter Tweet buttons suddenly didn't show up anymore.
I searched their documentation on http://instantclick.io/scripts for a solution and found out it might be possible by changing the .on('change') code. But the problem is, the Facebook script:
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&appId=XXXXXXXXXXXXXXX&version=v2.0";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
and the Twitter script:
<script type="text/javascript">
window.twttr = (function (d, s, id) {
var t, js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src= "https://platform.twitter.com/widgets.js";
fjs.parentNode.insertBefore(js, fjs);
return window.twttr || (t = { _e: [], ready: function (f) { t._e.push(f) } });
}(document, "script", "twitter-wjs"));
</script>
don't seem to use these codes to initiate it. Has anyone found a way to get this working? InstantClick seems like a wonderful way to speed up websites and if it worked with Twitter and Facebook it might just revolutionize the way the internet works.
UPDATE #1:
I found out how to fix Twitter by including it like this:
<script type="text/javascript" async defer src="//platform.twitter.com/widgets.js"></script>
But including Facebook sdk.js the same way doesn't work. Any ideas?
UPDATE #2:
Just a thought, maybe a fix would be to check if Facebook or Twitter .js are loaded and if not, load them again?

fb share button not displayed with ajax file

I used the following script in my web page
In body tag i used the following code
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.0";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
In my blog listing I used the following in each blog:
<div class="fb-share-button" data-href="http://test.com" data-layout="button"></div>
Its displayed fine. After 10 blogs while scroll the remaining data are loaded dynamically by using the ajax file.
Here also I used the above script and Div share button. But it is not displayed with the ajax loaded file.
I googled a lot and I couldn't find a right solution. Please help me to fix this.
after ajax, call function FB.XFBML.parse(); to force the refresh/rendering FB share buttons

How to obtain recent Facebook Post ID

I want to sync FB posts to my own website, which is Drupal site.
I found this embed code that allow me to embed posts to any website.
<div id="fb-root"></div>
<script>
(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s);
js.id = id;
js.src = "//connect.facebook.net/zh_CN/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
<div class="fb-post" data-href="https://www.facebook.com/Abner.Ma.1989/posts/411557558943779" data-width="466">
<div class="fb-xfbml-parse-ignore">由
马昕睿贴出
贴子。</div>
</div>
You can see if I change the code posts part
data-href="https://www.facebook.com/Abner.Ma.1989/posts/411557558943779"
to something else, then the embed content will change too.
So I think this might be one way to sync posts from FB to my own website.
So the question is : How could I obtain recent FB post ID?
Or: Any way to sync FB posts to my own website?
Thanks!

Categories