Meta Tags Will Be Dispalyed Here

Twitter Card Meta Tags Will Be Dispalyed Here

Open Graph Meta Tags Will Be Dispalyed Here

Open Graph Define:

Open Graph is a protocol introduced by Facebook in 2010. Open Graph meta tags are set of code that defines how Website URLs are displayed when shared on social media.

Purpose of OpenGraph

This Open Graph is used to integrate Facebook meta tags inside website pages to be rich graph objects to have the same functionality as the other Facebook objects.

The following below important Open Graph Meta Tags.

This tag defines the title of your content. There is no limit to the characters' number, but it should stay between 60 to 90

Example: <meta property="og:title" content="Title of your content" />

The defines the URL of the webpage with which the object is linked.

Example: <meta property="og:url" content="https://www.yourdomain.com" />

Alway Use canonical website URL. That helps to consolidate all the connected data, such as likes, across all the duplicate URLs posted.

This tag defines the content type that you are sharing. Either it's web-based, entertainment, place, people, or business. There are several other types.

Example: <meta property="og:type" content="content-type" />

og:description

This tag defines your content's short description, but it should be more than 200 characters. However, there is no proper limit. You can display up to 300 characters, but it's better that you should limit this to 200.

Example: <meta property=" og:description" content=" your content short description."/>

og:image

This tag defines image in the content. The eye-catching image always stands out. Without the image, your content is boring. Therefore, it's better to place an image in the meta tag.

Ensure that the image should not exceed 5MB and 1200 x 630 pixels (1.91/1 ratio) as Facebook imposes these limitations for image tags.

Example:<meta property="og:image" content="image URL" />

Add og:image:width and og:image:height meta tags to ensure a perfect snippet the first time someone shares it.

<meta property="og:image:width" content="1200"/>

<meta property="og:image:height" content="630"/>

Twitter Card Meta Tags

Twitter Cards are a protocol that allow to add rich photos, videos and other interactive media to Tweets on Twitter while sharing in order to drive traffic by using your website.

The following below defines Twitter Card Meta Tags

This tag defines the type of Twitter Card that should be displayed. The summary_large_image type displays a short summary with a large image preview.

your Twitter username, or your site or company’s username.

This tag defines sharing content title on Twitter.

This tag defines sharing content brief descriptio on Twitter.

This tag defines sharing Images on Twitter, Most standard image formats (JPG, PNG, GIF) are acceptable, but it must be less than 5MB in size. The image may be automatically cropped to display in differently sized cards, so it is a good idea to have the main focal point in the center.