404 page previews and errors on Facebook debugger

Hello everyone. I am facing an issue with all our Webflow pages every time someone shares a link on facebook. For the preview image, Facebook always shows the image from our 404 page although the shared page is valid URL.

putting the link in the Facebook debugger I always get the error: “URL returned a bad HTTP response code.” One suspect to this problem is the fact that we have added an iframe at the header which pulls data from our custom made web app. But I can’t confirm this.

Any idea how I can go around this?

many thanks

Hi there,

To resolve Facebook link preview issues, you can implement these solutions:

  1. Use the Facebook debugger tool to pre-cache your images and force Facebook to fetch the latest version of your page.

  2. Ensure your Open Graph images follow Facebook’s recommended dimensions (minimum 1080px width).

  3. Add the following Open Graph tags to your site’s head code (Site settings > Custom code tab > Head code section):

<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />

These tags help Facebook’s crawler properly display your images in link previews.

Hopefully this helps! If you still need assistance, please reply here so somebody from the community can help.

A few thoughts-

Make sure you have the og:image specified
FB debugger often needs to be refreshed, to tell it to re-scan the site a few times
If it’s still behaving strangely, you probably have a problem with your og:image. I’d verify the URL, file dimensions, and type. FB needs a minimum file height/width, a maximum file size, and may not like AVIFs.