Facebook Does Not Grab Proper og:Image On Initial Share

不羁的心 提交于 2020-01-07 02:15:36

问题


I have Wordpress site with a small bit of php code which creates the OpenGraph tags for each post. Unfortunately the Featured image (og:image) is not grabbed by Facebook when I copy the URL into a new FB post.

Just to clarify the flow of events:

  1. My users create a Wordpress post.

  2. Then someone shares it on Facebook by copying the link into a FB post. Facebook displays the proper text, but grabs the wrong og:image.

  3. I go to the object debugger and test the Wordpress post. It shows no errors and all the correct og tags (including the correct og:image) but displays the default (wrong) image for the site in its thumbnail!

  4. Then if I click the Scrape New button, the proper thumbnail (matching the og:image tag) appears.

  5. Now if a user shares the same Wordpress post in Facebook, FB -does- display the proper og:image in the FB post.

So initially the -default- image is being grabbed, but not the Featured image (ie. the post_thumbnail() in Wordpress parlance. However, if I open the 'Object Debugger For Facebook' and get a new scrape for the page, the correct image always appears. This has gotten tedious.

The maddening thing is that if I look in the Object Debugger for the initial scrape, although the Default Image is displayed (which is incorrect) if I look at the stats, the og:image tag Facebook says it sees is -correct-. So it's -says- it scraped the correct image, but is displaying the incorrect image!

The only error I ever see in the Object Debugger is that "the image may be too small. Images must be at least 200x200..."... which is not true. The image is always at -least- 300 x 209.

I've checked that the code in the page header generates properly.

I am not using a caching plug-in or a CDN.

So: How can I insure that FB always grabs the correct og:image WITHOUT having to open the object debugger and Scrape New.

Again: I've seen similar (old) questions here where the 'answer' was to run a new scrape for every post. Well, that just isn't going to fly with my users. We need a way to insure that a new post shows the correct og:image without having to do any extra work.

function insert_fb_in_head() {
    global $post;
    if ( !is_singular()) //if it is not a post or a page
        return;

//echo '<meta property="fb:admins" content="YOUR USER ID"/>';

  echo '<meta property="og:title" content="' . get_the_title() . '"/>';
  echo '<meta property="og:type" content="article"/>';
  echo '<meta property="og:url" content="' . get_permalink() . '"/>';
  echo '<meta property="og:site_name" content="example site"/>';
  echo '<meta property="og:description" content="' . get_post_meta(get_the_ID(), '_yoast_wpseo_metadesc', true). '"/>';

if(!has_post_thumbnail( $post->ID )) { //the post does not have featured image, use a default image
    $default_image="http://jchmusic.com/images/default-250.jpg"; //replace this with a default image on your server or an image in your media library
    echo '<meta property="og:image" content="' . $default_image . '"/>';
}
else{
    $thumbnail_src = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'medium' );
    echo '<meta property="og:image" content="' . esc_attr( $thumbnail_src[0] ) . '"/>';
    echo '<meta property="og:image:width" content="' . esc_attr( $thumbnail_src[1] ) . '"/>';
    echo '<meta property="og:image:height" content="' . esc_attr( $thumbnail_src[2] ) . '"/>';      

}
echo "";
}
 add_action( 'wp_head', 'insert_fb_in_head', 5 );
  /* Facebook ends *************/

来源:https://stackoverflow.com/questions/39601459/facebook-does-not-grab-proper-ogimage-on-initial-share

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!