5

I have a fully working facebook share pop up that work perfectly on desktop but just displays a facebook input field when viewed on a mobile device such as safari for the iphone?

DEMO FIDDLE http://jsfiddle.net/EYxTJ/345/

$('div').click(function(){   
    fb_click()
});

function fb_click() {
        var fb_title     = encodeURIComponent('my title goes here!');
        var fb_descr     = encodeURIComponent('my description goes here');
        var fb_url       = encodeURIComponent('www.example.com');
        var fb_image     = encodeURIComponent('http://www.highyieldbond.com/wp-content/uploads/2013/04/silver-apple-logo-apple-picture1.jpg');

        window.open('http://www.facebook.com/sharer.php?s=100&p[title]=' + fb_title + '&p[summary]=' + fb_descr + '&p[url]=' + fb_url + '&p[images][0]=' + fb_image, 'width=450','height=450');
    }

How it appears on a mobile device

fb share mobile

2 Answers 2

1

Some mobile devices do not handle click events. You have to use:

$('div').bind("click touchstart", function(){   
    fb_click();
});
2
  • Thanks, but the event itself is being triggered ok. It just is not being dealt with correctly by the facebook API. For completeness i tried it and it didn't work DEMO jsfiddle.net/EYxTJ/346
    – user1320260
    Feb 24, 2014 at 22:35
  • I tried the above method on safari and chrome for iPhone and it did not solve the issue
    – StevenPHP
    Feb 24, 2014 at 22:43
1

This is a common problem. You have two options (to my knowledge).

1) Use the php facebook SDK which is incredibly easy to use.

2) Use inline javascript as this seems to bypass the common problem

DEMO http://jsfiddle.net/5kNAw/1/

The sharer.php method does not allow parameters to be parsed to the mobile version of facebook. A work around is to load the desktop version for your share pop. You can do this using you JS function as above but with a small modification to the URL. As you will see in the example below i have added m2w& just after sharer.php. m2w means "mobile to web".

window.open('http://www.facebook.com/sharer.php?m2w&s=100&p[title]=' + fb_title + '&p[summary]=' + fb_descr + '&p[url]=' + fb_url + '&p[images][0]=' + fb_image, 'width=450','height=450');

1
  • Sorry, i've had to unaccept as this only works if you specify a URL only. Once i add summary and title it has the same problem as before. Why is this issue so difficult to fix!? :(
    – user1320260
    Feb 24, 2014 at 23:07

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.