This is facebook share button code from facebook
<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";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<!-- Your share button code -->
<div class="fb-share-button"
data-href="http://www.your-domain.com/your-page.html"
data-layout="button_count">
</div>
How can I get response of success or error from this?
I tried some examples but didn't got response after sharing via code.
Share button works and it also sharing the post.
window.fbAsyncInit = function() {
// init the FB JS SDK
FB.init({
appId : '1743496239724', // App ID from the App Dashboard
//channelUrl : 'http://exampb.com/plugins/', // Channel File for x-domain communication
status : true, // check the login status upon init?
cookie : true, // set sessions cookies to allow your server to access the session?
xfbml : true // parse XFBML tags on this page?
});
// Additional initialization code such as adding Event Listeners goes here
FB.ui(
{
method: 'feed',
},
function(response) {
if (response && response.post_id) {
alert('Post was published.');
} else {
alert('Post was not published.');
}
}
);
};
// Load the SDK Asynchronously
(function(d){
var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
if (d.getElementById(id)) {return;}
js = d.createElement('script');
js.id = id;
js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
ref.parentNode.insertBefore(js, ref);
}(document));
I tried this but its conflicting. With that share button obtained from FB.
You can use the Share Dialog, but it only responds with a proper callback if you authorize the User with the publish_actions permission: https://developers.facebook.com/docs/sharing/reference/share-dialog
Related
In a process of hiding piece of content for people who didn't like our page yet. Using Facebook SDK for the first time. The idea is to have a call to action text and button. Once button is clicked, if user already likes our page- it shows a piece of content. If not- shows a like button and shows piece of content after it's clicked.
Here is connecting SDK
window.fbAsyncInit = function() {
FB.init({
appId : '348511868693215',
xfbml : true,
version : 'v2.8'
});
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'));
And here is actual code for checking
FB.api({
method: "pages.isFan",
page_id: page_id,
}, function(response) {
console.log(response);
if(response){
//if liked
$(".show-poll").click(function(){
$(".actualpoll").show();
});
} else {
$(".show-poll").click(function(){
$(".likepage").show();
});
}
}
);
Your code "for checking" is executed before the SDK is loaded, i.e. before FB is available. Move the code inside the window.fbAsyncInit function. That function is called once the SDK is available.
I want to create a Facebook login button. Actually I did, but I need to get username, email and other information. How can I do this?
This is my code
<html>
<head></head>
<body>
<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/tr_TR/sdk.js#xfbml=1&version=v2.4&appId=168750412481****";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
<div class="fb-login-button" data-max-rows="1" data-size="large" data-show-faces="false" data-auto-logout-link="true" data-scope="email"></div>
</body>
</html>
How can I get data-scope user email or other scope properties?
Accualy i need full code example. Because i think facebook documents are complicated. (Or for me) And I found a solution internet. Here you can see below;
FB Login Button:
<div class="fb-login-button" data-max-rows="1" data-size="large" data-show-faces="false" data-auto-logout-link="true" data-scope="email,user_hometown,user_birthday,user_education_history,user_website,user_work_history"></div>
FB Sdk initialize:
(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/tr_TR/sdk.js#xfbml=1&version=v2.4&appId=***********";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
Getting other user information:
window.fbAsyncInit = function() {
FB.init({
appId : '************', // Set YOUR APP ID
channelUrl : 'http://hayageek.com/examples/oauth/facebook/oauth-javascript/channel.html', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true, // parse XFBML
version : 'v2.4',
oauth : true
});
FB.Event.subscribe('auth.authResponseChange', function(response)
{
if (response.status === 'connected')
{
console.log("<br>Connected to Facebook");
//SUCCESS
FB.api('/me', { locale: 'tr_TR', fields: 'name, email,birthday, hometown,education,gender,website,work' },
function(response) {
console.log(response.email);
console.log(response.name);
console.log(response.gender);
console.log(response.birthday);
console.log(response.hometown);
console.log(response.education);
console.log(response.website);
console.log(response.work);
}
);
}
else if (response.status === 'not_authorized')
{
console.log("Failed to Connect");
//FAILED
} else
{
console.log("Logged Out");
//UNKNOWN ERROR
}
});
};
Have a look at the docs at
https://developers.facebook.com/docs/javascript/examples#login
to see how you can do the Login and query the Graph API...
I'm building a website for a business. The business currently has a Facebook page. On the website i'm creating, i need to display the most recent Facebook post.
A Google search led me to a depreciated method, and Facebook says now to use the new Graph API, but i'm starting from no Facebook API experience so found it overwhelming and could use some help.
Here's where i am.
I'm doing this as a single page site with no server side language, so am only using JavaScript. So far I've got the FB JS SDK script after my body tag, and a app-id setup for my page.
<script>
window.fbAsyncInit = function () {
FB.init({
appId: 'your-app-id', // except real id
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>
I have linked my FB app with my FB page. Now i need to display the most recent post on my website.
FB.api(
"/{page-id}/feed",
function (response) {
if (response && !response.error) {
/* handle the result */
}
}
);
Source: https://developers.facebook.com/docs/graph-api/reference/v2.4/page/feed
You could just use the following API call to get only one entry:
/{page-id}/feed?limit=1
window.fbAsyncInit = function() {
FB.init({
appId : 'app id here',
autoLogAppEvents : true,
xfbml : true,
version : 'v3.2'
});
//For getting posts from wall,
FB.api(
'/me',
{access_token:'Access token here',
fields:"id,name,posts{attachments}"},
function(response) {
console.log(response)
}
);
//for getting posts from page we manage
FB.api(
"/page_id/feed",
{access_token:'access token',
fields:"attachments{url,media,description,title,type},created_time,description,message,updated_time"},
function (response) {
console.log(response)
if (response && !response.error) {
/* handle the result */
}
}
);
};
(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 = "https://connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
I'm trying really hard to learn how to do this but I keep running into problems.
FB.ui works for posting but every time I use FB.api it comes up as undefined and I get a random picture. What am I doing wrong?
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'numbers', // App ID
channelUrl : '/channel.php', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
FB.api('/me', function(user) {
if (user) {
var image = document.getElementById('image');
image.src = 'https://graph.facebook.com/' + user.id + '/picture';
var name = document.getElementById('name');
name.innerHTML = user.name
}
});
};
// Load the SDK Asynchronously
(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>
<div align="center">
<img id="image"/>
<div id="name"></div>
</div>
You need to call FB.login before making the API call. I guess, thats what you are missing.
I have just started working with the Facebook SDK and I am trying to use a script which grabs a user's name and friend's list. This is the initialization code I am working with:
window.fbAsyncInit = function()
{
console.log("initialising");
FB.init(
{
appId : 'APPID',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
oauth : true, // enable OAuth 2.0
xfbml : false // dont parse XFBML
});
FB.getLoginStatus(function(response) {
if (response.status === 'connected') {
console.log("RESPONSE IS CONNECTED!");
} else if (response.status === 'not_authorized') {
console.log("NOT AUTHORIZED");
} else {
console.log("NOT LOGGED IN");
FB.login();
}
});
};
(function(d, s, id){
console.log("Loading SDK!");
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'));
I have an fb-root element at the top of the document, outside of the script tags.
About half of the time, the SDK loads fine and I see the initialising and connected messages in the console. However, the other half of the time, I only see the "Loading SDK" message and nothing else, which I assume means that the SDK isn't loading correctly for whatever reason. I have also noticed that it loads on navigation to the page, but rarely on refresh.
My question is: what is causing the SDK to not load some of the time and how can I solve the issue?
According to the latest documentation from Facebook regarding the use of the Facebook JavaScript SDK, the method to include the SDK asynchronously has been updated:
(function(d){
var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
ref.parentNode.insertBefore(js, ref);
}(document));
It's not immediately obvious to me why this would be more reliable as compared to your approach but I can say this is what I use on my site and I have not experienced any intermittent issues,