Improving your Website Preview Cards on LinkedIn

A new post with a preview title and image.
A new post with a preview title and image.
A new post with no preview image.
A new post with no preview image.

How LinkedIn Gets Metadata

LinkedIn is not going to scrape your entire page to try and infer the title and image. Instead, it looks at the <meta> tags in your HTML’s <head>. “Title” and “description” tags are pretty standard, but it also looks for meta tags that are of the “Open Graph Protocol” type. This protocol was created by Facebook to more easily make a graph of websites. It is very involved, but we will only need three tags:

<meta property='og:title' content='My Title'/>
<meta property='og:image' content='URL to the image you want in the preview'/>
<meta property='og:description' content='This should be a short description'/>
A link in my 'featured' section without an image.
A link in my ‘featured’ section without an image.
Links in my 'featured' section with an image.
Links in my ‘featured’ section with an image.

A Quick Note on LinkedIn’s Cache

If you recently changed the head and meta properties of your site, the previews may not immediately show this. This is because LinkedIn caches a lot of this information. You can use LinkedIn’s post inspector to force LinkedIn to show you what the preview will look like.

Final Thoughts and Resources

For more technical information on what tags LinkedIn looks for, look here.

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store