Open Graph Meta tags (Facebook)

Open Graph Meta tags (Facebook)

0 11525
Facebook Open Graph Meta tags

No wonder, Facebook is social network number one that is used widely (especially in advertising) by nearly all companies worldwide. It is much more convenient to use the most known network where almost everyone living on our planet is registered in. This brings huge traffic, and many companies are working with their customers using their Facebook pages. Moreover, they use specal facebook widgets like: ‘Like’, ‘Share’, ‘Comments’ and ‘Recommend’ on their websites. The Open Graph Meta tags (or Facebook Open Graph API) that I am going to describe today will help you control over information to be shared on facebook (like url, title, image and description).

Overview

As the name implies, Facebook turns websites in some kind of graph objects. When we call any method (share, like and so on), Facebook requests the necessary information from the page where the function was called. Open Graph let us customize this information via custom meta tags on page. All these meta tags have og: prefix. Now, let’s have a look to all these meta tags.

Title

<meta property="og:title" content="Title example" />

The title tag is used to specify the page title.

Url

<meta property="og:url" content="http://website_url/" />

The url tag is used to indicate the webpage address (that should be canonical).

Image

<meta property="og:image" content="http://website_url/image.png" />

To allow Facebook to use a specific image, we can use the Image meta tag. We recommend to use images in popular formats: jpg / png. Try to avoid using very small images (for better quality).

site_name

<meta property="og:site_name" content="My website name" />

If you specify this meta tag, your website name will be recognized with this name.

Type

<meta property="og:type" content="article" />

This meta tag helps Facebook to categorize your website. Possible values are: article, place, product, profile and so on. Complete list of the types is here.

Description

<meta property="og:description" content="A brief description of the content" />

The description is usually between 2 and 4 sentences. It will be displayed below the title of the post on Facebook.

Video

<meta property="og:video" content="https://website_url/video/" />

This let you specify URL for the video. If you want the video to play in-line in News Feed, you should use the https:// URL if possible.

Conclusion

Today we described most popular Facebook Open Graph Meta tags. To get more details about other tags, visit the Open Graph page. The use of tags is invaluable to your site, use attractive titles and images, and you will notice an influx of new visitors from Facebook.

SIMILAR ARTICLES

jQuery Mobile Lesson 6

0 50
jQuery Mobile Lesson 5

0 75

NO COMMENTS

Leave a Reply