Showing Thumbnail for link in WhatsApp || og:image meta-tag doesn't work Showing Thumbnail for link in WhatsApp || og:image meta-tag doesn't work android android

Showing Thumbnail for link in WhatsApp || og:image meta-tag doesn't work


I belive you need to add itemprop to the og:image meta tag, have the image size set to 256x256 and also it would not harm to add the site_name, type and updated_time properties either :)

<meta property="og:site_name" content="San Roque 2014 Pollos"><meta property="og:title" content="San Roque 2014 Pollos" /><meta property="og:description" content="Programa de fiestas" /><meta property="og:image" itemprop="image" content="http://pollosweb.wesped.es/programa_pollos/play.png"><meta property="og:type" content="website" /><meta property="og:updated_time" content="1440432930" />

You can see these meta tags in action on for example Google Maps.
After you have changed your meta tags, you might need to wait a while for possible caches to update.

You can debug/verify Open Graph meta tags from the Facebook Debugger
If you can see all your tags there, then the sites/apps where your tags are not showing properly might have different requirements for Open Graph tags.

EDIT:
If you are going to specify an image by a HTTP-Secure link, you need to use og:image:secure_url instead of og:image.

EDIT2:
You also need to specify og:type as it is one of the four base required parameters.
<meta property="og:type" content="website" /> should get you in the right direction.


I had the same issue and the problem was the size of the picture. Whatsapp doesn't support picture with a size greater than 300KB.

So the most important property to display image on Whatsapp is:

<meta property="og:image" content="url_image">

And the size of the image to display must be less than 300KB


After spending months trying to figure this out, I finally solved the issue. Here is my solution:

<!-- MS, fb & Whatsapp --><!-- MS Tile - for Microsoft apps--><meta name="msapplication-TileImage" content="http://www.example.com/image01.jpg">    <!-- fb & Whatsapp --><!-- Site Name, Title, and Description to be displayed --><meta property="og:site_name" content="The Rock Photo Studio"><meta property="og:title" content="The Rock Photo Studio in Florida"><meta property="og:description" content="The best photo studio for your events"><!-- Image to display --><!-- Replace   «example.com/image01.jpg» with your own --><meta property="og:image" content="http://www.example.com/image01.jpg"><!-- No need to change anything here --><meta property="og:type" content="website" /><meta property="og:image:type" content="image/jpeg"><!-- Size of image. Any size up to 300. Anything above 300px will not work in WhatsApp --><meta property="og:image:width" content="300"><meta property="og:image:height" content="300"><!-- Website to visit when clicked in fb or WhatsApp--><meta property="og:url" content="http://www.example.com">

Copy the above, paste in head area of website.CLOSE your Whatsapp app, re-open, THEN test.No need to clear cache, and NO NEED TO CLEAR DATA.

Blessings to all!