How to enable picture appear when a link is shared on WhatsApp?

8k views Asked by At

enter image description here

How to enable images to be shown when a link is shared in whatsapp? Like the link above from amprandom.blogspot.com.

OG tags modified as needed. Still does not show images. How to get it work?

1

There are 1 answers

2
Vipul Asri On

You can use the Sharing Debugger to see the information that is used when your website content is shared on Facebook, Messenger and other places. The Batch Invalidator will let you refresh this information for multiple URLs at the same time. Open Graph markup lets you take control over how your website content appears to others.

Reference: https://developers.facebook.com/tools/debug/

Steps:

  1. Add needed og tags ex. og:title, og:image, etc in your website code.
  2. After adding necessary tags, go to Sharing Debugger and enter your website URL there.
  3. Click on Debug. It will show all the data scrapped by it and refreshes them.

Next time you share your website/link, it will scrap metadata added to it.

Edit: You need to add itemprop to the og:image meta-tag

Ex: change value of url_image to your image/ logo/ favicon url.

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

Thumbnail schema from schema.org inside for WhatsApp

<link itemprop="thumbnailUrl" href="url_image"> 
<span itemprop="thumbnail" itemscope itemtype="http://schema.org/ImageObject"> 
  <link itemprop="url" href="url_image"> 
</span>