Trying to set up a sharing mechanism with FB.ui. The issue is the share dialog opens a popup instead of it opening in the same page. The reason I'm trying to avoid the popup is that safari doesn't show the popup in mobile.
<script>
$(document).ready(function()
{
$.ajax(
{
url: '//connect.facebook.net/en_US/sdk.js',
dataType: 'script',
cache: true,
success:function(script, textStatus, jqXHR)
{
FB.init({
appId : 'someID',
autoLogAppEvents : true,
xfbml : true,
version : 'v3.0'
});
share();
}
});
});
function share() {
FB.ui(
{
method: 'share',
href: 'https://example.com',
quote: 'Some description',
title : 'Title',
hashtag: null,
display: 'iframe'
},
response => {
window.parent.postMessage(
{
earningRule: 'fb_share',
action: 'shared',
response: response
}
);
}
)
}
</script>
Is there any way to either avoid the popup or to address the safari popup blocking issue?
Thanks in advance
The main problem is that you are trying to open the dialog in the callback function of an AJAX request. You must use
FB.uidirectly on mouse interaction, or it will get blocked by browsers.If that does not work, you can use sharer.php instead: https://developers.facebook.com/docs/workplace/sharing/share-dialog/?locale=de_DE#sharedialogvialink