Open Graph Tags: 2026 Image Sizes, HTML & Checklist

Open Graph (og:*) meta tags are HTML <meta property="og:..."> elements placed inside your webpage <head> that control the title, summary, thumbnail image, and canonical link displayed when a URL is shared on LinkedIn, Facebook, WhatsApp, Slack, Discord, Telegram, and iMessage. When paired with twitter:card tags, a single 1200 × 630 pixel (1.91:1) image and five core HTML tags ensure your links render as high-converting visual cards on every platform.

You can generate validated markup right now using our free Open Graph tag generator and Twitter / X Card generator.

---

Complete Open Graph & Twitter/X Meta Tag Reference (2026)

Every indexable page on your website should include these core social metadata properties inside <head>:

Meta Property / Name	Required?	Recommended Value / Limit	Platform Behavior
og:title	Yes	40 – 65 characters (clear headline without long site suffix)	Used as the bold card title on LinkedIn, Facebook, Slack, Discord, and WhatsApp
og:description	Yes	110 – 160 characters (1–2 concrete sentences)	Displayed below the title on Slack, Discord, Facebook, and fallback parsers
og:image	Yes	1200 × 630 px (1.91:1), absolute https:// URL, < 5 MB	Renders the large visual preview banner across all networks
og:url	Yes	Clean canonical URL (https://www.example.com/page)	Consolidates share counts and prevents ?utm_ links from splitting previews
og:type	Yes	website (pages/tools) or article (blog posts/news)	Tells parsers whether to look for article publish dates and author fields
og:site_name	Recommended	Brand name (NitroSERP)	Shown above or below the card headline in messaging apps
twitter:card	Yes (for X)	summary_large_image (full banner) or summary (1:1 icon)	Forces X (Twitter) and Discord to display a full-width visual card

---

Copy-and-Paste HTML <head> Template (Open Graph + X Parity)

Paste this block into your HTML <head> (or configure it inside your CMS / Next.js Metadata object) so both Open Graph scrapers and Twitterbot render a full-width card from the same image asset:

<!-- Open Graph / Facebook / LinkedIn / Slack / Discord / WhatsApp -->
<meta property="og:type" content="article" />
<meta property="og:site_name" content="NitroSERP" />
<meta property="og:title" content="Open Graph Tags in 2026: Complete og:image &amp; HTML Guide" />
<meta property="og:description" content="Copy-and-paste Open Graph and Twitter Card HTML tags with exact 1200x630 image specifications for LinkedIn, X, Slack, and WhatsApp." />
<meta property="og:url" content="https://www.nitroserp.com/blog/open-graph-tags-2026" />
<meta property="og:image" content="https://www.nitroserp.com/og/open-graph-guide-1200x630.png" />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />
<meta property="og:image:alt" content="Diagram showing 1200x630 Open Graph card layout across LinkedIn, Slack, and X" />

<!-- X (Twitter) Card Parity -->
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="Open Graph Tags in 2026: Complete og:image &amp; HTML Guide" />
<meta name="twitter:description" content="Copy-and-paste Open Graph and Twitter Card HTML tags with exact 1200x630 image specifications." />
<meta name="twitter:image" content="https://www.nitroserp.com/og/open-graph-guide-1200x630.png" />

---

Platform-by-Platform og:image Dimensions & Cropping Rules

While 1200 × 630 px works everywhere, each platform crops or scales edges slightly differently. Check our social media image size guide alongside this table when designing templates in Figma:

Social / Messaging App	Recommended Size	Aspect Ratio	Critical Safe-Zone Rule
LinkedIn Feed & Messages	1200 × 627 px (or 1200 × 630 px)	1.91:1	Keep text at least 80px inside all four edges
X (Twitter) Large Card	1200 × 628 px (or 1200 × 630 px)	1.91:1	Bottom-left corner displays domain badge overlay on mobile
Facebook Feed & Messenger	1200 × 630 px (min 600 × 315 px)	1.91:1	Images smaller than 600 × 315 px collapse into a tiny square thumbnail
WhatsApp Link Preview	1200 × 630 px (< 300 KB ideal for fast load)	1.91:1 (or 1:1 crop)	Center your primary logo/headline inside the middle 600 × 600 px square
Discord & Slack Unfurls	1200 × 630 px (< 5 MB)	1.91:1	Include og:image:width and og:image:height so cards unfurl on the first share

---

5 Common Bugs That Silently Break Social Link Previews

1. Using a relative path in og:image (/images/og.png): Social crawlers do not resolve relative image paths reliably. Always provide a complete, absolute HTTPS URL (https://www.example.com/images/og.png).
2. Leaving og:image:width and og:image:height out: When a URL is shared for the very first time on Facebook, Slack, or Discord, the crawler must download the image asynchronously before rendering the card unless og:image:width and og:image:height are declared in the HTML.
3. Rendering Open Graph tags only via client-side JavaScript: facebookexternalhit, LinkedInBot, Twitterbot, and Slackbot do not execute client-side React/SPA JavaScript. Your <meta property="og:*"> tags must be present in the initial server-rendered (SSR/SSG) HTML response.
4. Blocking social bots in robots.txt or firewall rules: Ensure your robots.txt (check with our robots.txt generator) and CDN WAF allow Twitterbot, LinkedInBot, facebookexternalhit, and Slackbot to fetch both your HTML pages and your /og/ image directory.
5. Serving SVG as og:image: Open Graph scrapers do not support .svg files for og:image. Always serve rasterized .png, .jpg, or .webp images.

---

Frequently Asked Questions About Open Graph Tags

Do Open Graph tags directly improve Google search rankings?

Open Graph tags are not a direct ranking signal for traditional web search queries. However, Google Discover and Google Search mobile visual snippets can fall back to og:image when picking a representative page thumbnail, and clean social previews improve referral traffic and brand engagement.

How do I clear cached Open Graph previews on LinkedIn, Facebook, or X?

Social networks cache og:* tags for 7 to 30 days. After updating your HTML:

• LinkedIn: Paste your URL into the LinkedIn Post Inspector to force an immediate recrawl.
• Facebook / Meta: Use the Meta Sharing Debugger and click Scrape Again.
• X / Slack / Discord: Change the og:image filename (e.g., cover-v2.png) or append ?v=2 when sharing the link.

How do I generate Open Graph, Twitter Card, and SEO meta tags together?

Use our free Open Graph tag generator for og:* properties, the Twitter / X Card generator for timeline cards, and the SEO meta tag generator for your complete <head> snippet. For general meta tag strategy, read how to optimize meta tags in 2026.