Getting WhatsApp Rich Snippet Previews Working



Published: 2018-08-28 23:10:06 +0000
Categories: Misc,

Language

Misc

Description

This is something that catches me out from time to time, as I have to worry about it so infrequently. When setting up Opengraph metadata on a new site, snippets might display correctly on Facebook's Opengraph debugger but when you share a link on WhatsApp you don't get a link preview (or do and the image is missing).

The metadata required is listed below, but 9 times out of 10 it's because I've not included itemprop="image" on the og:image declaration (something which Facebook's OG debugger won't flag).

Snippet

<meta property="og:type" content="article" />
<meta property="og:title" content="$page_title" />
<meta property="og:image:type" content="image/jpeg" />
<meta property="og:image" itemprop="image" content="$thumbnail_url" />
<meta property="og:image:width" content="$thumbnail_width" />
<meta property="og:image:height" content="$thumbnail_height" />
<meta property="og:url" content="$article_url" />
<meta property="og:description" content="$article_description" />

Usage Example

<meta property="og:type" content="article" />
<meta property="og:title" content="Saab 9-3 Door Lock Unit Repair" />
<meta property="og:image:type" content="image/jpeg" />
<meta property="og:image" itemprop="image" content="https://www.bentasker.co.uk/images/Documentation/saab_93_door_lock_unit/IMG_20180805_095544.jpg" />
<meta property="og:image:width" content="667" />
<meta property="og:image:height" content="500" />
<meta property="og:url" content="https://www.bentasker.co.uk/documentation/vehicles/371-saab-9-3-door-lock-unit-repair" />
<meta property="og:description" content="The central locking door lock mechanisms on Saab 9-3s (and 9-5s) are known to occasionally stop working properly." />

Keywords

Whatsapp, microdata, rich snippets, image, preview, OpenGraph, og,

Latest Posts


Copyright © 2019 Ben Tasker | Sitemap | Privacy Policy
Available at snippets.bentasker.co.uk and snippets.6zdgh5a5e6zpchdz.onion