Tomer B
Tomer B

Reputation: 5465

Facebook preview image doesn't match scraper information

I just recently launched a game on steam, and when I share a link in facebook the preview image doesn't appear.

I ran the object debugger.

From the results, in the og:image field, I can see the image correctly, however in the preview itself the image is broken.

Any ideas?

Edit: Since this is a steam page, my ability to influence it is limited. I can only change some images, but I cannot add meta tags. I did find, however, in this post, that a <link rel="image_src" href="/myimage.jpg"/> tag should also be identifiable by facebook as a preview image. For some reason in my page facebook either ignores this or treats the image as invalid (although it is larger than 200x200)

Upvotes: 0

Views: 1399

Answers (2)

Florian Reisinger
Florian Reisinger

Reputation: 3088

og:image could not be downloaded or is too small
og:image was not defined, could not be downloaded or was not big enough.
Please define a chosen image using the og:image metatag, and use an image 
that's at least 200x200px and is accessible from Facebook.
'http://store.akamai.steamstatic.com/public/images/game/game_highlight_image_spacer.gif' will be used instead.
Consult http://developers.facebook.com/docs/sharing/webmasters/crawler for more troubleshooting tips.

So we do have the reason why it is blank (spacer.gif is blank)

Screenshot dev tools chrome This is the same for other pages as well...

http://cdn.akamai.steamstatic.com/steam/apps/455980/header.jpg?t=1459222551 <-- Can be found in the header...

So lets have a closer look at the image itself...

The images are creatd ondemand (so it seems) and you (a.jpg) is the same as Cities Skylines (b.jpg)

IrfanView Image information

So no idea at all... Maybe a problem with Steam's CDN (FB is unable to find the image. Did you update the image recently?)

Sorry not to be able to help. The image itself cannot be faulty IMHO as stream is processing the image every time...

Cannot say more :/

Upvotes: 1

Fernando Torres
Fernando Torres

Reputation: 470

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:

  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.

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

Upvotes: 0

Related Questions