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.
Related
at the bottom of this page (https://go.microgreensfarmer.com/video1) you will see I added the Facebook comments plugin. Well I would love to get rid of the date/time that is listed along with each comment. Is this possible?
Here is the Javascript SDK I have in the body:
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'your-app-id',
autoLogAppEvents : true,
xfbml : true,
version : 'v2.9'
});
FB.AppEvents.logPageView();
};
(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>
And here is the HTML I have on the page:
<div class="fb-comments" data-href="http://microgreensfarmer.com" data-width="100%" data-numposts="5" order_by="reverse_time"></div>
Any way to edit these so date/time is not displayed alongside comment?
Unfortunately for you, this is not possible using Facebook's comments plugin. This is probably because Facebook wants to show its own identity. For full details of the plugin and the options you have, you can take a look here (If you haven't already)
https://developers.facebook.com/docs/plugins/comments
Sorry!
TLDR:- JS amateur here. Call to Graph API, FB.INIT() did not work from my local machine. But worked from my Github static website. Why?
Detail:
I am learning (or trying to learn) web app development on my own, after going thru some tutorials thought of creating webpage with JS which calls FB graph API.
Copied FB provided code to load SDK and logic to show like buttons.
Nothing happened when i opened HTML thru browser, but when I pushed it on GitHub it worked! Not sure why?
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'xxxxxxxxxxxxx',
xfbml : true,
version : 'v2.6'
});
};
(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>
-----------------------------------------
**Code to show like/share buttons:-**
<div
class="fb-like"
data-share="true"
data-width="45"
data-show-faces="true">
</div>
_____________________________________-
Thank you for taking time reading thru this.
It is because the url that you have specified for you Facebook app as callback url is that of github. You can change it for a while and test and see, it will work for "localhost" but not for "127.0.0.1".
Or you can create two apps.
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";
});
This may be a dumb question but i'm not such a hacker (yet! hehehe)...
I have successfully developed a Facebook App to display my website in a Facebook tab inserting the following code right after the "body" tag to an HTML site:
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'MY_APP_ID_NUMBER',
xfbml : true,
version : 'v2.4'
});
};
(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>
You can see it here: https://www.facebook.com/jogojogomx/app_1096645967031976
You can see the original HTML site at jogojogo.mx
BUT NOW, I want to do the same with a Wordpress themed website. I have tried to put it in different .php files of the theme with no success...
See this link: https://www.facebook.com/Cochinita.YUKTK/app_1024054777627795
Can anyone help?
Thanks in advance!
So I went through the facebook documentation found here, but my share button still isn't showing up.
I added this directly beneath the body tag in my _layout.cshtml page:
<div id="fb-root"></div>
script
window.fbAsyncInit = function () {
FB.init({
appId: 'xxxxxxxxxxxxxxxx',
status: true,
xfbml: true
});
};
(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/all.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
script
(I removed the less than/greater than around the script tag in order to get the code block to show up on SO)
And I added this to my homepage for testing purposes:
<div class="fb-share-button" data-href="http://myurl.com" data-width="50px" data-type="button_count">Share</div>
I have to add in the text for the div element just to "see" the "Share" text.
Where am I going wrong? I figured adding the facebook widget thing would provide the facebook image/icon and share count, am I wrong?
Ugh, stupid AdBlocker/Avast anti-virus software...