Philip Miglinci

LinkedIn link preview for Wordpress

Open Graph Protocol

Today I was able to fix a nasty side effect of wordpress that resulted in wrong link previews on LinkedIn.

www.safereach.net is a simple Wordpress website with standard plugins like the W3TC caching plugin and the YOAST SEO plugin.

The data for the link preview should be fetched from the information provided via the Open Graph Protocol. But despite the seo plugin setting the correct headers, the link preview did not display the information.

Before

LinkedIn preview before installing the plugin

After

LinkedIn preview after installing the plugin

Solution

The OGP header had a conflict with the oembed data from Wordpress!

Correct OGP data

<!-- This site is optimized with the Yoast SEO plugin v5.7.1 - https://yoast.com/wordpress/plugins/seo/ -->
<meta name="description" content="Als Krisenkommunikationsdienst bietet safeREACH Unternehmen die Möglichkeit vordefinierte Personengruppen sicher, schnell und zielgerichtet zu erreichen."/>
<link rel="canonical" href="https://www.safereach.net/" />
<meta property="og:locale" content="de_DE" />
<meta property="og:type" content="website" />
<meta property="og:title" content="safeREACH - Die Lösung für schnelle und sichere Krisenkommunikation" />
<meta property="og:description" content="Als Krisenkommunikationsdienst bietet safeREACH Unternehmen die Möglichkeit vordefinierte Personengruppen sicher, schnell und zielgerichtet zu erreichen." />
<meta property="og:url" content="https://www.safereach.net/" />
<meta property="og:site_name" content="safeREACH " />
<meta property="og:image" content="https://www.safereach.net/wp-content/uploads/sites/2/2017/10/safeReach_v1.png" />
<meta property="og:image:secure_url" content="https://www.safereach.net/wp-content/uploads/sites/2/2017/10/safeReach_v1.png" />

Conflicting oembed data

<link rel="alternate" type="application/json+oembed" href="https://www.safereach.net/wp-json/oembed/1.0/embed?url=https%3A%2F%2Fwww.safereach.net%2F" />
<link rel="alternate" type="text/xml+oembed" href="https://www.safereach.net/wp-json/oembed/1.0/embed?url=https%3A%2F%2Fwww.safereach.net%2F&#038;format=xml" />

How to remove the oembed links in Wordpress?

The wordpress Plugin Disable Embeds is the right tool for the job. It has only 2.7 kb and 108 loc.

If you have any questions, just hit me up on Twitter:

How to fix the LinkedIn preview for your Wordpress Blog. TLDR; conflicting OGP and oembed headers:

https://twitter.com/pmigat/status/923548106704261120

— Philip Miglinci (@pmigat) 2017-10-26