WhatsApp/Facebook link preview not working (but seems scraped correctly)

0
votes

The Facebook/WhatsApp preview isn't working for one website I have and I'm currently at a loss of what could be missing. I already tried everything on other posts.

Besides title, description, favicon and x-ua-compatible I currently have the following OG properties:

  <meta property="og:url" content="https://markas.pt" />
  <meta
    property="og:title"
    content="markas | plataforma de marcas portuguesas"
  />
  <meta
    property="og:description"
    content="Plataforma de marcas Portuguesas com dados abertos para o objetivo de divulgação e promoção do que é nacional"
  />
  <meta property="og:site_name" content="markas.pt" />
  <meta property="og:image" content="http://www.markas.pt/ogimage_redux.jpg" />
  <meta
    property="og:image:secure_url"
    content="https://www.markas.pt/ogimage_redux.jpg"
  />
  <meta property="og:image:width" content="256" />
  <meta property="og:image:height" content="256" />
  <meta property="og:image:alt" content="markas.pt" />
  <meta property="og:image:type" content="image/jpeg" />
  <meta property="og:type" content="website" />
  <meta property="og:locale" content="pt_PT" />

Here's what I've tried:

  • Change og:image to 1200x630 resolution and/or in PNG
  • Remove og:image:secure_url and other og:image subproperties
  • Add "itemprop=image" to og:image property

It seems to be correctly scraped by Facebook as the sharing debugger shows the preview. But in WhatsApp/Facebook still doesn't show up. I only have a warning for lacking fb:app_id but I know of other websites that don't have it and have link preview.

Anyone knows what could be missing?

htmlfacebook-opengraphmeta
I recently had issues related to previews not showing up and what worked for me was re-ordering the og:tags (not kidding). It sounds like my issue was slightly different from yours because I was unable to see my previews in the fb sharing debugger, but may be worth trying! Good luck, I know how frustrating this can be! – coloradocolby
Try moving your meta tags to before your large (143kb) script tag. I don't know if it's an issue, but it's something to try. Also, your twitter:card tag has your description text rather than "summary" (I doubt that makes a difference for WhatsApp, but I know Telegram looks at the twitter:card tag). – Rich DeBourke
@RichDeBourke since I was using sapper for SSR I assumed this wouldn't be a problem but indeed it helped :-) thank you – Mondego
I suspected that WhatsApp wasn’t downloading your entire html file. I checked your server using curl -I https://markas.pt/ and your server responded with Accept-Ranges: bytes so WhatsApp could be asking for the first 10KB or something. Since you had a large script tag before your meta data, WhatsApp probably wasn’t seeing your tags. WhatsApp is now at least showing your title in the link preview, but I’m not seeing an image, even though your site specifies one. Not sure why. – Rich DeBourke