Do you use Open Graph to control how your links are shared?

Last updated by Tiago Araújo [SSW] over 3 years ago.See history

Open Graph is a metadata tag that allows you to control what content shows up when a page is shared on social media networks.

It should be placed on the <head> section of your page. The most used properties are:

<meta property="og:title" content="Your Custom Title" />
<meta property="og:description" content="Your custom description of the page." />
<meta property="og:image" content="https://www.YourCustomImage.jpg"/>

open graph bad
Figure: Bad example - Shared link has no image and the title was "guessed" by LinkedIn

opengraph good
Figure: Good example - Shared link has a nice image and title, both defined via Open Graph tags

Note: For LinkedIn you might need to add the prefix as following:

<metaprefix="og: http://ogp.me/ns#" property='og:title' content="Microsoft Azure | SSW Consulting - Sydney, Brisbane, Melbourne"/>

More information and other properties can be found at The Open Graph protocol.

Adam Cogan
Tiago Araujo
We open source.Loving SSW Rules? Star us on GitHub. Star
Stand by... we're migrating this site to TinaCMS