facebookfacebook-opengraphshare-open-graph

Facebook's debugger shows a preview image, yet on Facebook it doesn't pull in that same preview image?


Facebook will randomly take posts I have shared on a company page and make the preview image blank/white. It is maddening.

Here's what I do to replicate:

Example URL: https://hoist.digital/content/blog/know-the-value-of-phone-calls-and-grow-your-business-with-call-tracking

Open graph code in on that URL

    <meta property="og:image" content="https://hoist.digital/images/3/1/d/5/1/31d518d87ae71ad5bb2acc907b3ad304b99971e1-graphicstock-beautiful-young-mother-with-her-newbornsoeul9rzz.jpg" />
    <meta property="og:image:secure" content="https://hoist.digital/images/3/1/d/5/1/31d518d87ae71ad5bb2acc907b3ad304b99971e1-graphicstock-beautiful-young-mother-with-her-newbornsoeul9rzz.jpg" />

Video of me replicating this: https://hoist.digital/facebookattempt.webm

If the open graph code is there, it's secure, what else could be causing Facebook to occasionally flake out and make some of the preview images white/blank? Here's a strange kicker too... sometimes I can edit/refresh the preview image within Facebook, and the preview image will show again... but in a few days it goes back to white/blank.


Solution

  • Unfortunately, it is well-known problem on Facebook that has not been fixed for years and there is no canonical answer to your question.

    The main problem is URIs using HTTP works just fine and URIs using HTTPS do not. So first of all, you should try to change your og:image:secure property to og:image:secure_url, because due to documentation there is no og:image:secure property.

    If it does not help, you can explore this thread and you gonna try different options unless, of course, you have tried it yet.

    Please pay attention to such methods: