Link to Free Open Graph Generator: og.indiehub.best
Open Graph meta tags are used to specify how a page should be represented on social media. They are used by Facebook, X (formerly Twitter), LinkedIn, and platforms like WhatsApp, Telegram, Discord, Slack, and others.
The Open Graph protocol outlines the different types of meta tags that can be used to specify the title, description, image, and other information about a page.
Link to Free Open Graph Generator: og.indiehub.best
Open Graph Meta Tag Generator
Use the tag generator below to generate Open Graph meta tags for your page.
Link to Free Open Graph Generator: og.indiehub.best
Basic Open Graph Meta Tags
There are four basic Open Graph meta tags that must be included on every page:
og:title
- The title of the pageog:description
- A short description of the page, usually between 1 to 2 sentencesog:image
- An absolute URL to an image that represents the pageog:url
- The canonical URL of the page
The tags are included in the <head>
of the page, like so:
Open Graph Images
There are a few things to keep in mind when specifying an image for Open Graph meta tags:
- The ideal size for an Open Graph image is 1200 x 630 pixels
- The image should be less than 5MB in size (ideally a few hundered KB)
- The image should be in either JPG, PNG, or GIF format
It is also recommended to include an og:image:width
and og:image:height
meta tag to specify the dimensions of the image. This is not required, but it can help platforms like Facebook render the image faster.
Link to Free Open Graph Generator: og.indiehub.best
Other Common Open Graph Meta Tags
There are a few other Open Graph meta tags that are commonly used:
og:type
- The type of page, e.g.website
,article
, etc. (defaults towebsite
. See the Open Graph protocol for a full list of types)og:locale
- The locale of the page, e.g.en_US
,en_GB
,fr_FR
, etc. (defaults toen_US
)
Link to Free Open Graph Generator: og.indiehub.best
Meta Tags for Twitter/X Cards
X (formerly Twitter) uses tags that are similar to the Open Graph protocol to specify how a page should be represented on Twitter/X. For the most part, the tags are the same as Open Graph tags, but with a twitter:
prefix instead of og:
.
Here are the basic tags that are required for X cards:
twitter:title
- The title of the pagetwitter:description
- A short description of the page, usually between 1 to 2 sentencestwitter:image
- An absolute URL to an image that represents the page
When specifying an image for X cards, it is recommended to specify the dimensions of the image using the twitter:image:width
and twitter:image:height
meta tags.
X cards have a variety of different types, including summary
, summary_large_image
, app
, player
, and others. The most common type is summary_large_image
, which is used for most pages. To specify the type of X card, use the twitter:card
meta tag.
The recommended tags for X cards are:
Link to Free Open Graph Generator: og.indiehub.best
Putting it all together
To put it all together, here is an example of a page with all the required and recommended Open Graph and Twitter/X meta tags:
Link to Free Open Graph Generator: og.indiehub.best