2

I want to make like Facebook og meta but for whatsapp messaging for my website like attached screenshot, as I looked into google's meta tags and found this role attribute but found nothing that I can use to accomplish it.

How could I achieve this?

Here is what I referred.

<meta content="images/imagery" item prop="image">

whats app messaging example

CandleCoder
  • 1,387
  • 4
  • 21
  • 45
Mahmoud Zakaria
  • 43
  • 1
  • 1
  • 8
  • Like this explanation [here](http://stackoverflow.com/questions/25100917/showing-thumbnail-for-link-in-whatsapp-ogimage-meta-tag-doesnt-work/32154775#32154775), probably. – Virtua Creative Jan 02 '16 at 15:48

1 Answers1

9

You can just use the existing OpenGraph data for this. You will have to inject tags like

<meta property="og:title" content="I'm going to Joy of Coding 2016 :)">
<meta property="og:description" content="Fancy going to Joy of Coding 2016 as well? Buy your tickets now!">
<meta property="og:url" content="https://shop.inventid.nl/132">
<meta property="og:image" content="https://customerimages.inventid.nl/c8737a37-9297-4a29-a969-e20adc31efb4_1400_800.jpg">

Remember that if you have a pure Javascript application, you might have to resort to tools such as Prerender (prerender.io) to present correct data to crawlers (also Facebook or Twitter for example)

More information about opengraph data can be found on the website http://ogp.me/

Rogier Slag
  • 526
  • 3
  • 7
  • is there any way i can tell whatsapp bot to crawl image tag only first time and after that only title tag ? – Steeve Mar 03 '17 at 07:56
  • You could use server side use agent inspection and give whatsapp a reduced HTML page with only that information – Rogier Slag Mar 05 '17 at 13:35
  • If you have a page based on Javascript you should use a tool like prerender.io to make it work. Do you have an example URL? – Rogier Slag Nov 11 '17 at 18:23
  • Note: There are updates in the best to add metadata, which are described here: https://stackoverflow.com/questions/25100917/showing-thumbnail-for-link-in-whatsapp-ogimage-meta-tag-doesnt-work#32154775 – Arnold Schrijver Oct 30 '18 at 18:34