fb not defined for fb share dialog plugin - javascript

I have included following code in footer file of my project:
<script>
$(document).ready(function(){
window.fbAsyncInit = function() {
FB.init({
appId : '996999210390006',
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'));
});
function sharefbDialog()
{
alert("fb");
FB.ui({
method: 'share',
href: 'https://developers.facebook.com/docs/',
}, function(response){});
}
</script>
Where i call sharefbDialog function onclick of anchor tag but it always gives fb not defined error. Initially I put fb.init code outside document.ready but even then it didn't work. I have look into all stackoverflow solution but no success.


you can also call the function this way.
<html5>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '996999210390006',
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'));
function sharefbDialog()
{
alert("fb");
FB.ui({
method: 'share',
href: 'https://developers.facebook.com/docs/',
}, function(response){});
}
sharefbDialog();
</script>
<head>
<body>
<h2>Hello<h2>
<a href="" onclick="sharefbDialog();" >Testing </a>
</body>
</html5>

Related

Would it matter where in the DOM tree that I insert the external JavaScript resource?

I am reading the official Facebook JS SDK script:
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'your-app-id',
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'));
</script>
It inserts the created <script> tag to the fjs.parentNode. Is that by design?
If I write replace:
fjs.parentNode.insertBefore(js, fjs);
with:
document.head.appendChild(js);
Would it still work?

Yes both will work but
fjs.parentNode.insertBefore(js, fjs);
This will insert JS before all JS file and other-side
document.head.appendChild(js);
This will insert after all JS in Head.

Get facebook like click in new windows with javascript

I need to get facebook like click button on a new window that my website will open.
When click on the like button I want to show a thank you message.
I try:
<script>
function openWin() {
myWindow = window.open("https://www.facebook.com/permalink.php?story_fbid=ID", "myWindow", "width=200, height=100");
}
FB.Event.subscribe('edge.create', function(response) {
alert("thank you for like");
});​
</script>
<button onclick="openWin()">Open facebook to like post</button>
but it is not working. what is wrong?

Make sure the JavaScript SDK is loaded correctly BEFORE using FB.Event.subscribe: https://developers.facebook.com/docs/javascript/quickstart/v2.4
For example:
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'your-app-id',
xfbml : true,
version : 'v2.4'
});
FB.Event.subscribe('edge.create', function(response) {
alert("thank you for like");
});​
};
(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>

Facebook App : Error in the execution of Javascript SDK

I just begin the facebook development, and I try to make the first app with javascript SDK.
However, when I go the page where I install the code, I have an error message saying that "does not work , try again later."
My application is in development mode and it's the good Appdata
In facebook dashboard I entered as domain: http://yofitness.fr
Someone have an idea ?
<body>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '{624205284323943}',
status : true,
xfbml : true
});
FB.ui({
method: 'send',
name: 'People Argue Just to Win',
link: 'http://www.nytimes.com/2011/06/15/arts/people-argue-just-to-win-scholars-assert.html',
});
};
(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>
</body>

Change appId:'{624205284323943}', to appId: '624205284323943',

Google Analytics and FB's Like button

Hi I need track with google analytics how much people click on FB's Like button but it doesn't work (yes I read a few tutorials and still nothing).
I have this code:
<script>
window.fbAsyncInit = function() {
FB.init({
appId: 'xxxx',
status: false,
cookie: true,
xfbml: true
});
FB.Event.subscribe('edge.create',
function(href, widget) {
$.fancybox.close('#div');
_gaq.push(['_trackSocial', 'facebook', 'like']);
}
);
};
(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_GB/all.js#xfbml=1&appId=xxxx";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
GA js code is in head tag and FB js code is immediately under body tag.
Thank for your time and your answer.

Facebook Like Box Disappearing

So whenever I add the first part of this script (everything from window.fbAsyncInit all the way to FB.Canvas.setAutoResize(100);), my Facebook Like Box doesn't pop up.
All I'm trying to do is remove the iframe scrollbars for the Like Box, which obviously has to be done in the submission to Facebook.
Why would adding this function at the top make the box disappear? How do I make the scrollbars go away?
I was trying to follow the instructions here:
http://clockworkcoder.blogspot.com/2011/02/how-to-removing-facebook-application-i.html
Here's my code:
<script>
window.fbAsyncInit = function() {
FB.init({
appId: '388149184641600',
status: true,
cookie: true,
xfbml: true
});
FB.Canvas.setAutoResize(100);
(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#xfbml=1&appId=388149184641600";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

You're missing the closing bracket:
<script>
window.fbAsyncInit = function() {
FB.init({
appId: '388149184641600',
status: true,
cookie: true,
xfbml: true
});
FB.Canvas.setAutoResize(100);
}; // HERE
(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#xfbml=1&appId=388149184641600";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>

Categories