Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
1.2k views
in Technique[技术] by (71.8m points)

wordpress - Facebook ignoring OG image on first share

I'm developing a WordPress site and using the yoast seo plugin to generate an og image on a dynamic page. However, I think this is not related to that. The og image link appears perfectly, but if I click on the share button, no image is included unless I have already clicked on the share button before, or used the facebook developer tool to scrape the page first.

Is this a facebook issue, or a server issue perhaps?

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

You can avoid this by either getting your content “pre-scraped” by triggering a scrape via API as soon as you publish it, or by specifying the image dimensions via OG meta tags as well.

https://developers.facebook.com/docs/sharing/best-practices#precaching:

When content is shared for the first time, the Facebook crawler will scrape and cache the metadata from the URL shared. The crawler has to see an image at least once before it can be rendered. This means that the first person who shares a piece of content won't see a rendered image

There are two ways to avoid this and have images render on the first Like or Share action:

  1. Pre-cache the image with the URL Debugger
    Run the URL through the URL debugger to pre-fetch metadata for the page. You should also do this if you update the image for a piece of content.

  2. Use og:image:width and og:image:height Open Graph tags
    Using these tags will specify the image to the crawler so that it can render it immediately without having to asynchronously.

The second one is probably easier to implement; although you might have to modify your plugin that generates the OG meta tags (or choose a different one) if it doesn’t provide an option to output the image dimensions as well already.


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...