简体   繁体   中英

Facebook share not posting image to user wall

I am trying to share image and content from a webpage to User's FB wall but it is not posting it. Image is shown in share pop up but not shown in User's wall. I have following code for this purpose. In head section i have

<meta property="og:url" content="http://objdevelopment.com/notice/ddfdf" />
<meta property="og:type" content="website" />
<meta property="og:title"  content=" Notice of Passing" />
<meta property="og:description"   content="Notice of Passing " />
<meta property="og:image" content="http://objdevelopment.com/notice/wp-content/uploads/65a4465e9258729f8085c4d780700dad.jpg" />

and in HTML i have

 <div id="fb-root"></div>

 <script type='text/javascript'>

  (function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
    js.src = "http://connect.facebook.net/en_US/sdk.js#version=v2.3&appId=937475996303874&status=true&cookie=true&xfbml=true";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>


<!-- Your share button code -->
<div class="fb-share-button" data-href="http://objdevelopment.com/notice/onope/ddfdf/" 
    data-layout="button_count">
</div>

and it is showing like this http://www.awesomescreenshot.com/image/510674/5e1cdc7572ab3946a36a23ff2c49b014

Clicking on Share button it opens following window https://drive.google.com/file/d/0B54OjkhFLGPXNXI2MWgya1RRWFU/view?usp=sharing

and on wall it is showing like this http://www.awesomescreenshot.com/image/510678/ca4fc6be51aed2db5049b96546a6cd99

where as my expectations are: https://drive.google.com/file/d/0B54OjkhFLGPXdGluaF9PNzdEakk/view?usp=sharing

For live testing please visit

http://objdevelopment.com/notice/onope/ddfdf/

Found some resources on web and fixed this issue. i have used following code to fix this

HTML

<a class="fb-share-button fb_share"  href="#" data-href="[page_url]"  data-image="[image_url]" data-title="[Post_title]  " data-desc="[Post_description]" >   <i class="fa fa-facebook"></i> </a>

Javascript

<script>
/**FB SHARE**/

window.fbAsyncInit = function() {
FB.init({
    appId: 937475996303874,
    status: true,
    cookie: false,
    xfbml: true
});
};

(function(d, debug){var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];if   (d.getElementById(id)) {return;}js = d.createElement('script'); js.id = id; js.async = true;js.src = "//connect.facebook.net/en_US/all" + (debug ? "/debug" : "") + ".js";ref.parentNode.insertBefore(js, ref);}(document, /*debug*/ false));

function postToFeed(title, desc, url, image) {
var obj = {method: 'feed',link: url, picture: image,name: title,description: desc};
function callback(response) {}
FB.ui(obj, callback);
}

var fbShareBtn = document.querySelector('.fb_share');
//fbShareBtn.addEventListener('click', function(e) {
jQuery('.fb_share').click(function(e){
e.preventDefault();
//alert();
var title = fbShareBtn.getAttribute('data-title'),
    desc = fbShareBtn.getAttribute('data-desc'),
    url = fbShareBtn.getAttribute('href'),
    image = fbShareBtn.getAttribute('data-image');
//console.log(image+ "Hello");
postToFeed(title, desc, url, image);

return false;
});
/**FB SHARE**/
</script>

In Html replace text between [ ] with your own values.

I looked at the source of the provided page, and found no open graph meta tags. You should make sure those meta tags are printed.

You're seeing the correct image on the share box because you specified the path in the data-image attribute on the share button. But Facebook uses a crawler to pick up stuff from your page to show on the wall, and that crawler depends on open graph meta tags, which are missing

I think you have to debug your website url, Here you can see what image facebook is sharing. ( https://developers.facebook.com/tools/debug/ ). Please try it.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM