Enter Your Open Graph Data
What Are Open Graph Tags and Why Do They Matter?
Open Graph (OG) tags are a set of HTML meta tags developed by Facebook in 2010 that allow web developers to control how their content appears when shared across social media platforms and messaging apps. When someone shares a URL on Facebook, LinkedIn, Twitter, WhatsApp, Telegram, Slack, Discord, or almost any other social or messaging platform, the platform reads the Open Graph tags embedded in that page's HTML to generate a rich link preview — complete with an image, title, and description. This preview is often the primary factor determining whether someone clicks the link or scrolls past it.
Without Open Graph tags, social platforms attempt to auto-generate previews by guessing which title, image, and description to use — often with disappointing results. They might select an irrelevant thumbnail image, pull a generic site description instead of page-specific content, or display the raw URL with no preview at all. For marketers, bloggers, e-commerce businesses, and content creators, a poorly rendered social preview directly translates to lower click-through rates, reduced traffic, and diminished brand perception. Properly configured OG tags can increase social media click-through rates by 200% or more for the same content.
The OG tag ecosystem has evolved significantly. The original Facebook specification covered the basics (og:title, og:description, og:image, og:url, og:type), but modern implementations also include og:image:width, og:image:height, og:image:alt for accessibility, og:locale for language targeting, and article-specific tags like og:article:author and og:article:published_time for news content. Twitter independently developed its Twitter Card system, which provides similar functionality but with Twitter-specific formatting. Fortunately, Twitter falls back to OG tags when Twitter Cards aren't present, so a single well-configured set of OG tags covers most platforms.
Image optimization is the single most impactful aspect of Open Graph implementation. The recommended image size is 1200×630 pixels at a 1.91:1 aspect ratio — this displays correctly across Facebook, LinkedIn, and Twitter without cropping. Images should be at least 600×315 pixels minimum, but larger images display more prominently in feeds and attract more attention. For Twitter specifically, the summary_large_image card type shows a large, prominent image while the summary type shows a small square thumbnail. Our checker lets you preview both card types side-by-side so you can choose the format that best showcases your content.
Essential Open Graph Tags Explained
- og:title — The page title as shown in social previews. Can differ from your HTML title tag. Recommended: 60–70 characters
- og:description — The description shown below the title. Recommended: 100–200 characters
- og:image — The image displayed in the preview. Must be an absolute URL. Recommended: 1200×630px JPG or PNG
- og:url — The canonical URL of the page. Should match your page's canonical link tag
- og:type — Content type: "website" for most pages, "article" for blog posts and news, "product" for e-commerce
- og:site_name — Your brand/website name, shown separately from the page title on some platforms
How to Add Open Graph Tags to Your Website
- Use this tool to preview and validate your OG data and generate the HTML tags
- Copy the generated tags and paste them inside the
<head>section of your HTML, before the closing</head>tag - For WordPress, use the Yoast SEO or Rank Math plugin which manages OG tags automatically from your post editor
- After deploying, test with the Facebook Sharing Debugger and Twitter Card Validator to verify your tags are being read correctly
- If Facebook shows stale cached data, use the Sharing Debugger's "Scrape Again" button to force a cache refresh