1

I've been trying for 3 days now to set a sharable image for whatsapp. But it does not show up. Facebook, twitter and messenger is working but whatsapp does not find my og:image.

enter image description here

This is my site: http://sayhi.dog

In the <head> I have this:

<meta property="og:image" itemprop="image" content="http://sayhi.dog/social-img.png?v=2"/>
<meta property="og:image:secure_url" content="https://sayhi.dog/social-img.png?v=2" />
<meta property="og:url" content="https://sayhi.dog/" />
<meta property="og:type" content="Website" />
<meta property="og:title" content="SayHi.dog" />
<meta property="fb:app_id" content="2151404768488502" />
<meta property="og:description" content="SayHi.Dog is een nieuw platform voor hondenouders. Leer wat het is, meld je hond aan, win prijzen en verdien beloningen voor jouw hond." />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="Vrienden uitnodigen">
<meta name="twitter:description" content="SayHi.Dog is een nieuw platform voor hondenouders. Leer wat het is, meld je hond aan, win prijzen en verdien beloningen voor jouw hond.">
<meta name="twitter:image" content="https://sayhi.dog/social-img.png?v=1">
<meta name="twitter:domain" content="https://sayhi.dog">

What could be wrong here ?

Dakota Maker
  • 633
  • 4
  • 24
Jenssen
  • 1,801
  • 4
  • 38
  • 72

1 Answers1

2

The issue is coming from the size of your image. According to this very nice post and @Cedriga, the max size for an image to be displayed is 300KB and after downloading your image I can see your image is almost 800KB:

screenshot of the file size

You will either have to get a different picture or try and compress the image!

One site I found after a quick google search to compress a png can be found here: https://tinypng.com/

Upon using it out of my own curiosity it managed to compress the image to ~213KB and it looks pretty good imo:

screenshot of compression

enter image description here

Dakota Maker
  • 633
  • 4
  • 24
  • Thanks! I've done that but the image is still not showing -_- how on earth is this possible ?!? – Jenssen Jun 18 '19 at 17:16
  • @Jenssen Hmmm.. Just reading through things quickly but have you tried using the new image along with waiting a few seconds before sending so that way whatsapp has a chance to retrieve the image maybe? It was something mentioned on the post I linked, but I will continue to look into it as well.. also try seeing if maybe only having `og` variables in the head works... if removing the twitter and fb lines works then it may be something even weirder – Dakota Maker Jun 18 '19 at 18:06
  • @Jenssen sorry for the long winded comments but also looking at @jony89's comment from the post from before, try adding `` and also try changing the URL then change it back because whatsapp caches URL and image info.. otherwise there is also this question: https://stackoverflow.com/questions/25100917/showing-thumbnail-for-link-in-whatsapp-ogimage-meta-tag-doesnt-work/39182227#39182227 which someone also set the width and height of the image to fix the issue which I suspect may be the issue imo – Dakota Maker Jun 18 '19 at 18:12