Why is a meta tag property og:image useful and how do you use it?

Experience Level: Mid-level
Tags: HTML Open Graph Protocol


The meta tag with an attribute property that has a value og:image defines an absolute URL of an image that points to an image that represents your webpage. The image URL will be added to the Open Graph object. The image URL is stored in a value of an attribute content.

By adding a meta tag with this property, you define an absolute URL of an image that the social networks will be able to read and display to their users.

A web page that has  Open Graph Protocol meta tags enables the page to become an open graph object. This object can then be exported to social networks or other 3rd party systems that understand Open Graph Protocol.

  <meta property="og:image" content="https://www.bettercoder.io/images/logo.png" />


Related Open Graph Protocol job interview questions
Open Graph Protocol
Open Graph Protocol

Are you learning Open Graph Protocol? Try our test we designed to help you progress faster.

Test yourself