ℹ Info Open Graph

og:description Could Be Longer — Maximize Your Social Preview Space

You have room for a more detailed description to increase engagement.

What's the issue?

Your og:description is between 50 and 70 characters. While it's not critically short, you're leaving valuable space unused. Social platforms give you room for a much more compelling pitch.

Why longer descriptions perform better

Social media link previews are mini ads for your content. A 50-character description is like a billboard with half the text missing — you're paying for the space but not using it.

With 110-160 characters, you can:

Explain what the content is about
Highlight why it matters
Include a call to action

How to improve it

<!-- Could be longer (60 chars) -->
<meta property="og:description" content="A guide to improving your website's social media tags." />

<!-- Better (140 chars) -->
<meta property="og:description" content="Step-by-step guide to Open Graph tags that make your links stand out on social media. Includes examples for React, Next.js, and Astro." />

Expansion strategies

Add specifics — Numbers, frameworks, tools mentioned
Include the benefit — What will the reader gain?
Mention the format — "Video tutorial", "Free tool", "Cheat sheet"
Add social proof — "Used by 10,000+ developers"
Create curiosity — "The #1 mistake most developers make with OG tags"

Check your Open Graph tags

Related articles

Missing og:title

The og:title tag is essential for social sharing. Without it, platforms will use the page title or URL.

og:title Is Too Long

Titles longer than 60 characters may be truncated on social platforms.

og:title Is Too Short

Short titles may not be descriptive enough for social sharing.

Missing og:description

The og:description tag provides a summary of the page content for social platforms.

og:description Is Too Long

Descriptions over 160 characters may be truncated on social platforms.

og:description Is Too Short

Short descriptions miss the opportunity to engage users.

OpenGraph MCP Server

Inspect OG tags directly from your editor

The OpenGraph MCP server lets you inspect and analyze Open Graph meta tags directly from your AI-powered editor or assistant. It provides two tools:

inspect_og — Fetch and score OG tags for any URL
suggest_og_tags — Generate recommended meta tag HTML

Add the server to your project's .cursor/mcp.json file:

{
  "mcpServers": {
    "opengraph": {
      "command": "npx",
      "args": ["-y", "opengraph-mcp"]
    }
  }
}

Restart Cursor after adding the configuration.

Add to your .vscode/mcp.json file (requires GitHub Copilot extension):

{
  "servers": {
    "opengraph": {
      "command": "npx",
      "args": ["-y", "opengraph-mcp"]
    }
  }
}

Make sure you have GitHub Copilot with MCP support enabled.

Add to your claude_desktop_config.json file:

{
  "mcpServers": {
    "opengraph": {
      "command": "npx",
      "args": ["-y", "opengraph-mcp"]
    }
  }
}

The config file is at ~/Library/Application Support/Claude/claude_desktop_config.json on macOS or %APPDATA%\Claude\claude_desktop_config.json on Windows.

Add to your ~/.codeium/windsurf/mcp_config.json file:

{
  "mcpServers": {
    "opengraph": {
      "command": "npx",
      "args": ["-y", "opengraph-mcp"]
    }
  }
}

Restart Windsurf after modifying the configuration.

Add to your Zed settings.json under context_servers:

{
  "context_servers": {
    "opengraph": {
      "command": {
        "path": "npx",
        "args": ["-y", "opengraph-mcp"]
      }
    }
  }
}

Open settings with Cmd+, and add the configuration.

Usage examples

▶ "Inspect the OG tags of github.com"

▶ "Suggest OG meta tags for my website https://example.com"

▶ "Check if my blog post has proper Open Graph tags"