FB.ui share how to open in page instead of popup

360 Views Asked by At

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

1

There are 1 best solutions below

0
andyrandy On

The main problem is that you are trying to open the dialog in the callback function of an AJAX request. You must use FB.ui directly 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