FB.ui send Send dialog - facebook

I have an iframe which contains the link as shown below:
<a href="javascript:void(0)" onclick="FB.ui({method: 'send', picture: pic, name: name, description : description , to: [xxxxxxxxxx],link:'http://link.com'}, function(response) {if (response) {alert('cool!')}})>Click me</a>
Any idea about how to make the FB.ui send dialog pop not in the iframe but in the parent window?
Thanks!

There is a 'display mode' for FB.ui ,set it to what you want.For more details check,
http://developers.facebook.com/docs/reference/dialogs/#display

Related

Text and Link sharing by share_open_graph API

I am getting issue with FB share_open_graph API. I have some text on a page and have one button to share that text and page URL (http://www.example.com?article_id=123).
Clicking share button text and link get share on Facebook users wall. But if user click the post from Facebook wall then link is got update with new parameters "fb_action_ids and fb_action_types".
Updated URL: http://www.example.com?article_id=123&fb_action_ids=422174444504370&fb_action_types=og.shares
Now if user wants to share again those text and page link FB share_open_graph API throws errors
enter image description here
FB.ui({
method: 'share_open_graph',
action_type: 'og.shares',
action_properties: JSON.stringify({
object : {
'og:url': url, // your url to share
'og:title': title,
'og:description': desc
}
})

Facebook share dialog does not close after posting or cancelling

Using v2.0 of the Facebook API, the share dialog popup doesn't close after the "Cancel" or "Post to Facebook" button has been selected. Previously, a 'redirect_uri' param was passed to the Feed endpoint, and this could be used to close the window. When trying to pass this param to the Share endpoint, however, I get the message: 'When using FB.ui, you should not specify a redirect_uri.'
Is there any way to force the popup window to close? And if not, might there be a problem with the API request? The link DOES get shared when "Post to Facebook" is selected, so I don't think it's an issue with login or permissions.
Here is what the API call looks like:
FB.ui({
method: 'share',
href: location.href,
)}, function(response){});
Try adding a preventDefault. I had the FB.ui action being triggered when an anchor tag was clicked. When I clicked the link, the page refreshed. Then when I'd click 'Post to Facebook' in the popup, I presume that the callback had nowhere to go.
What worked for me:
handleFbShare = (e) => {
e.preventDefault();
FB.ui({
method: 'share',
display: 'popup',
href: 'https://your-url/',
}, function(response){});
}
(...)
<a href="" className='button__facebook' onClick={this.handleFbShare}>Share on Facebook</a>
Hope that helps!

How to change Facebook send dialog name and thumbnail?

so I implemented Facebook send dialog in my Facebook app, but the problem is that it always displays server name and some random thumbnail. I put everything as it shown in Facebook documentation but nothing works.
This is my code:
FB.ui({
method: 'send',
name: 'myName',
picture: 'image/path',
link: 'https://apps.facebook.com/APP_ID/',
});
You should read https://developers.facebook.com/docs/sharing/reference/send-dialog according to that page the parameters you can pass in are: app_id, redirect_uri, display, to, link. Neither name or picture are listed.

Facebook JavaScript SDK: FB.ui opens a popup window

I am trying to show a 'Post to Your Wall' feed dialog with the following code in a facebook iframe app:
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js">
</script>
<script>
FB.init({
appId:'249725835046216', cookie:true,
status:true, xfbml:true
});
FB.ui({ method: 'feed',
message: 'Facebook for Websites is super-cool',
name: 'Facebook Dialogs',
link: 'http://developers.facebook.com/docs/reference/dialogs/',
picture: 'http://fbrell.com/f8.jpg',
caption: 'Reference Documentation',
description: 'Dialogs provide a simple, consistent interface for applications to interface with users.'
});
</script>
The problem is that it is appearing in a new popup window like this:
Instead of appearing as like this without appearing in a popup window:
I don't want the feed dialog to appear in a new popup windows because in most modern web browsers where popups are blocked. I don't know why this is happening. Please help.
I'm pretty sure that you get a popup if the user has not authorized your application. Facebook made it work that way for security reasons. If you prompt for authorization first, then you should get the inline dialog.
Note that the request for authorization will itself be a popup, but you only have to have that happen once. I have things working this way, the way you want, in the someecards Facebook app. Feel free to grab the javascript code, it's not specific to the app.
Try this, put FB.ui inside FB.getLoginStatus:
FB.getLoginStatus(function(response) {
if (response.authResponse) {
FB.ui({
method: 'feed',
...
display: 'dialog'
});
}
});
in my case the problem seems to have been solved by seting display to async
display: 'async',
i think this is default for page tabs and canvas, but from time to time, instead of appearing within the main window it would load a new popup..
after setting it though (page tab in my case) i haven't noticed any pop up coming up since then..
I know this is a bit old, but I stumbled across this page when trying to solve this problem for myself and none of the answers here worked for me.
For the benefit of anyone else who has this problem, this was happening for me because I was trying to call the dialog on page load. Moving it to a user triggered event (such as a click) resolved it for me.
I have the same UI issue and I don't like the pop up window too.
I just found a link.
It helps us to redirect the page in same window. But it does not solve our problem perfectly.
There's a "URL Redirection" section in the docs for the Feed Dialog:
https://www.facebook.com/dialog/feed?
app_id=145634995501895
&display=popup&caption=An%20example%20caption
&link=https%3A%2F%2Fdevelopers.facebook.com%2Fdocs%2F
&redirect_uri=https://developers.facebook.com/tools/explorer
So you can do window.location=(this url) in Javascript, setting the redirect_url correctly, and this should work without a popup.
Note that the Feed Dialog is now deprecated in v2.0, so check out the Share Dialog instead:
To share a link:
https://www.facebook.com/dialog/share?
app_id=145634995501895
&display=popup
&href=https%3A%2F%2Fdevelopers.facebook.com%2Fdocs%2F
&redirect_uri=https%3A%2F%2Fdevelopers.facebook.com%2Ftools%2Fexplorer
To share an Open Graph story:
https://www.facebook.com/dialog/share_open_graph?
app_id=145634995501895
&display=popup
&action_type=og.likes
&action_properties=%7B%22object%22%3A%22https%3A%2F%2Fdevelopers.facebook.com%2Fdocs%2F%22%7D
&redirect_uri=https%3A%2F%2Fdevelopers.facebook.com%2Ftools%2Fexplorer
The 'display=popup' bit affects how the share screen looks, it doesn't open a new window. Possible values for display are:
async, iframe, page, popup, touch, wap

How do you add a custom share link to a FBML page on facebook?

I'd simply like to make an image-click in my FBML page to trigger facebook's ajax dialog box. How do I accomplish this?
I have an FBML tab on my facebook fan page. In the content of that tab, I would like an image to function as a share button.
By following these directions, I can customize a share button, but the image itself that the user clicks on is not customizable. I want to be able to provide my own image, not use the silver share button provided by facebook.
By following these alternative directions I can use my own image. Perfect! Except on thing... Share.php opens as a page instead of as a javascript dialog. So when the user completes the dialog, it closes the whole page!
Here's what it looks like right now. Sorry, you have to click "Like" to see the share image. When you click the image, the share page opens, but I just want the ajax dialog.
I believe you can do what you want using the facebook feed dialogs:
http://developers.facebook.com/docs/reference/dialogs/
this is the javascript that you will have to bind to your onClick event of your link:
FB.ui(
{
method: 'feed',
name: "Name",
link: "http:\\www.facebook.com\pages\#\page_id_here",
picture: "http:\\path\to\image\file.jpg",
caption: "Caption",
description: "Description",
message: "Message"
},
function(response) {
//callback function
}
);