Facebook Open Graph META Tags Example

Open Graph LogoThe Open Graph(OG) protocol enables any web page to become a rich object in a social graph using Meta Tags. As marketers create a lot digital content to attract users and engage them on social media – anyone who creates content must know about the Open Graph protocol and how to use the content and images to display the best social media experience for its users.

In this short example I will show you how to use the OG protocol to display a rich social media display for your links.

First of all, we need know the simple syntax of the META tag.

Open Graph uses a few attributes that you need to edit and integrate into your META tags.

There is no need to explain them all here, let me just show you how they look in plain code:

You can use the Facebook Debugger to see how your Open Graph tags look before publishing your content.

Check out a live DEMO of this example.