facebook tab iframe specific page open - facebook

i just want to ask, i have a Facebook tab , which opens a small website like an frame in this tab , how can i add a link to the tab for a specific page in the frame "" lets say for example tab frame have 3 pages "home , about us , contact us" how can i add a share button which redirect me to this tab and i find contact us opened.
knowing that using static frame app .
and this is my code
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
// init the FB JS SDK
FB.init({
appId : '535262793177723', // App ID from the app dashboard
channelUrl : 'http://bridgestone.thesocialclinic-server.com/', // Channel file for x-domain comms
status : true, // Check Facebook Login status
xfbml : true // Look for social plugins on the page
});
FB.Canvas.scrollTo(0,0); };
// 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'));
function mohammad(){FB.Canvas.scrollTo(0,0);}
</script>
<script type="text/javascript">
function getParameterByName(name) {
name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
results = regex.exec(location.search);
return results == null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
}
</script>
<iframe src="http://bridgestone.thesocialclinic-server.com" scrolling="no" style="border:none;" width="100%" height="2000" onload="mohammad()"></iframe>

You would need app_data URL parameter, and use a link such as http://www.facebook.com/[page_name]/?sk=app_[app_id]&app_data=[specific_page]
Where app_data will be in the 'signed_request'. So you set app_data=page3, and check the parsed signed request value of app_data, and perform a redirect within your app.

After A lot of testing and checking , the result was that i was using static HTML application to add a new tab and get some benefit from fan gate etc...
but that was the problem , after creating the tab in the normal way without any application it worked like a charm.
thank you cdbconcepts for your help .

Related

Facebook Send UI renders empty window

I was just about to test something so I made 2 buttons with 2 links:
1.) using the facebook sharer.php functionality which works fine
2.) triggering the send ui using the URL redirect I took from the FB developers homepage:
http://www.facebook.com/dialog/send?app_id=123050457758183&link=http://www.nytimes.com/2011/06/15/arts/people-argue-just-to-win-scholars-assert.html&redirect_uri=https://www.bancsabadell.com/cs/Satellite/SabAtl/
I replaced the app id and both links with my own. My app is set up so it point to the links, since I know I had it running once before, where that was the problem.
Now as said the share button works perfectly fine but when I click one the other button I just see a white screen. The URL is in the address bar. Firebug shows no console errors and an empty head and body tag.
Any suggestions?
Thanks,
Gerd
UPDATE: I also implemented the regular javascript ui.send method. The window popsup. I am connected with facebook as the ssl seal shows but again nothing but white.
As far as the URL is concerned the URL is fine it is just a matter of time until Facebook allows to share a URL it has not indexed before. When I changed the link to my main domain instead of subfolder it worked.
As far as the JS SDK is concerned I forgot to check whether the user is logged in or not so this is how it works:
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'YourId',
xfbml : true,
version : 'v2.0'
});
};
(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>
<button onclick="sendFb()">Recommend JS</button>
<script type="text/javascript">
function sendFb(){
FB.getLoginStatus(function(response) {
if (response.status === 'connected') {
FB.ui({
method: 'send',
link: 'yourlink.com',
});
}
else {
FB.login(function(response) {
if (response.authResponse) {
FB.ui({
method: 'send',
link: 'yourlink.com',
});
}
else
alert('Not Authenticated!');
});
}
});
}
</script>
</body>
</html>

Facebook Feed Plugin issue

I have used the Social Plugin in the past to place an HTML newsfeed on a website. I'm trying to do the same thing, but I'm not getting the feed to display. In fact, if I visit https://developers.facebook.com/docs/plugins/activity the demo is not displaying. Could this be something with my browser, or a bug in the plugin? Any guidance is much appreciated!!
I have this immediately after the body tag, and I have the html pasted in it's proper place.
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
// init the FB JS SDK
FB.init({
appId : 'YOUR_APP_ID', // App ID from the app dashboard
status : true, // Check Facebook Login status
xfbml : true // Look for social plugins on the page
});
// Additional initialization code such as adding Event Listeners goes here
};
// Load the SDK asynchronously
(function(){
// If we've already installed the SDK, we're done
if (document.getElementById('facebook-jssdk')) {return;}
// Get the first script element, which we'll use to find the parent node
var firstScriptElement = document.getElementsByTagName('script')[0];
// Create a new script element and set its id
var facebookJS = document.createElement('script');
facebookJS.id = 'facebook-jssdk';
// Set the new script's source to the source of the Facebook JS SDK
facebookJS.src = '//connect.facebook.net/en_US/all.js';
// Insert the Facebook JS SDK into the DOM
firstScriptElement.parentNode.insertBefore(facebookJS, firstScriptElement);
}());
</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/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>

FB.init is called twice but I only have a like button from Facebook

I'm currently trying to allow user to connect to my site with their Facebook account but I have some issues.
First of all, you have to know that I already added a Like button with this 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/fr_FR/all.js#xfbml=1&appId=myappid";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<script type="text/javascript">
var urlfb = document.location.href;
$(document).ready(function(){
$('fb\\:like').attr('href', urlfb);
});
</script>
So I saw the post of Facebook on how to add Facebook Login to his website but each time I launch the page where I pasted the FB code, there is this famous error message: FB.init has already been called - this could indicate a problem.
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'myappid', // App ID
channelUrl : '', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
What do I have to do to remove this error ? I tried to remove my Like button and no more error but I want to keep this like button, so what do I have to delete to make it works ?
Any ideas ?
Thanks
Adding #xfbml=1&appId=myappid to the end of the SDK URL makes it automatically initialze itself – so just remove that part, change
js.src = "//connect.facebook.net/fr_FR/all.js#xfbml=1&appId=myappid";
into
js.src = "//connect.facebook.net/fr_FR/all.js";

facebook send button blank when site url does not contain filename (index.html)

My widget works fine on condition that url of the site contains file name. f.e. It is working with
www.domain.com/subdomain/path/index.html and keeps showing blank when address of site is www.domain.com/subdomain/path/.
That's kinda weird behavior, i know that there were some issues with facebook's send-box, but i couldn't find one fitting into my bug.
I dynamically change url and make a call to FB.XFBML.parse();
Using such a code for facebook widget then
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'appID',
status : true,
cookie : false,
xfbml : true
});
fbApiInit = true; //init flag
};
(function(d, debug){
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 = "http://connect.facebook.net/en_US/all" + (debug ? "/debug" : "") + ".js";
ref.parentNode.insertBefore(js, ref);
}(document, /debug/ false));
Please tell me what to do.
The important thing is that i'd rather prefer both of addresses to work, if it's not possible, it would be great to have opportunity to use addres with no filename.ext
Everything is working fine now.
I just realized facebook does not allow to use sending no-extension addresses.
I was using
$('.fbMenu :first-child').attr('href',document.location.toString()).attr('ref','text');where document location was just a path.
Such a simple code fixed the issue:
$('.fbMenu :first-child').attr('href',document.location.toString().indexOf('html')==-1?document.location.toString().replace('#','index.html#'):document.location.toString()).attr('ref','text');

facebook login js sdk redirect

am trying to use facebook login on my site and here is how i load the sdk
window.fbAsyncInit = function() {
FB.init({
appId : '362869753746986', // App ID
channelUrl : '//WWW.FESTIVEHUB.COM/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
});
// Additional initialization code here
};
// 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));
and the login button
<div class="fb-login-button" data-show-faces="true" data-width="200" data-max-rows="2"></div>
if i click the login button it shows a new facebook window for login and if i do it logs in the problem however are after the login the small new window remains and it blank but if i manually close it and refresh my page the login button is replaced with my FB profile picture so i need that login window to close automatically and i need a callback function so i can take action after the login. NB am working on localhost if its worth noting!
Your code looks OK, but your issue is probably your channelUrl file. The domain on the channel URL, your applications registered URL, and the URL you are trying to login from all have to match. The channel file also needs to have a single line
<script src="https://connect.facebook.net/en_US/all.js"></script>
to work.