FB Share dialog picture not showing

1
votes

I have used the Facebook share dialog to allow users to post links from within my webapp for a long time without problem. However since a couple of weeks back it is not working any more. I have not made any changes and I cannot find anything in the FB documentation either.

I use this code (image is an URL to a png): 

FB.ui({
    method: 'share',
    title: 'LISTEN TO: ' + title,
    href: 'https://www.papereed.com/player?id='+_shareableArticle.id,
    picture: image,
    caption: caption,
    description: description,
    message: ''
});

Earlier the picture, caption and description was showing up in the share dialog (and in the post after sharing). Now none of them are showing up, only the default title and picture from www.papereed.com are displayed in the share dialog. The link (href) still points to the correct place however.

I hope someone can explain what (if anything) has changed with FB.ui and what I need to do to get sharing with picture and caption to work again. Thanks!

BTW. Go to www.papereed.com/player and select the share option on one of the articles, then press FB icon and see the (non-working) share dialog for yourself.

2
javascriptfacebookfacebook-graph-apifacebook-javascript-sdk
Maybe search Stackoverflow because the question have been answered many many times before. And Facebook listed the change in developers.facebook.com/docs/apps/changelog - WizKid

2 Answers

2
votes

picture & caption is deprecated from fb api. Now these are no longer used by any version of facebook api.

1
votes

As stated: picture etc. are depreciated parameters.

Instead: FB now scrapes the webpage at "link", examines the content for og: namespace markup to get the various meta-data to share.

https://developers.facebook.com/docs/sharing/webmasters#markup

So you must share something that points to a valid single webpage and the meta content of that webpage will describe the Facebook share parameters now.

e.g. 

<html prefix="og: http://ogp.me/ns#">
<head>
<title>The Rock (1996)</title>
<meta property="og:title" content="The Rock" />

More about the Open Graph namespace: http://ogp.me/