How do you create the "share" popup in an iframe Facebook app
I currently have the following method which creates a "share url" essentially the code to insert into an onclick="" within the app.
The problem is that now we can no longer have Facebook FBML applications, only iframe - is there a library I now need to include to make this work? Or should I be changing the code, I have Googled but answers are widely inconclusive or backhacks to force it to work.
public function getShareUrl($title, $url, $caption, $description, $imageSrc, $shareButtonText = 'Share your thoughts!')
{
$url .= "var attachment = {
'name':'$title',
'href':'$url',
'caption':'$caption',
'description':'".$description."',
'media':[{
'type':'image',
'src':'$imageSrc',
'href':'$url'
}]
};
var actionLinks = [{
'text':'Join the app now',
'href':'$url'
}];
Facebook.streamPublish('', attachment, actionLinks, null, '$shareButtonText');
return false;";
return $url;
}
Thanks all! :)
Answer
To make a share popup appear from within your facebook app, you have to use the Javascript SDK
you can do this:
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml">
<head>
<title></title>
</head>
<body>
<div id="fb-root"></div>
<script type="text/javascript" src="http://connect.facebook.net/en_US/all.js"></script>
<script type="text/javascript">
FB.init({
appId : 'yourappid',
status : true,
cookie : true,
xfbml : true
});
</script>
<script type="text/javascript">
function streamPublish(name, description, hrefTitle, hrefLink, userPrompt, imageSrc, imageUrl) {
FB.ui({
method: 'stream.publish',
message: '',
attachment: {
media: [{
type: 'image',
src: imageSrc,
href: imageUrl
}],
name: name,
caption: '',
description: (description),
href: hrefLink
},
action_links: [{
text: hrefTitle,
href: hrefLink
}],
user_prompt_message: userPrompt
}, function (response) {
// do something when you have posted
});
}
function publishStream() {
streamPublish("Stream Publish", 'sample publish', 'do something cool', 'http://example.com', "My fb app", 'http://bit.ly/AJTnf', 'http://bit.ly/hifZk');
}
</script>
<p>Stream Publish Test</p>
<a href="#" onclick="publishStream(); return false;">Post a story</a>
</body>
</html>