vibecheck0.3.0
Search visibilityseoog-title-missinginfo

Missing og:title in Next.js

og:title is the bold headline on a shared link card. When it is absent, platforms fall back to the page <title> — which is tuned for search results, not for a social card, and sometimes carries a long brand suffix that gets cut. Setting it explicitly lets you write copy that fits the card.

Symptoms

  • Share cards reuse the SEO title, brand suffix and all
  • Headlines on social cards read awkwardly or get truncated
  • No independent control over the share headline

How VibeCheck catches it

In your widget · Problems

infoseoMissing og:title

To your coding agent · MCP

agent › get_detected_issues
{ detector: "seo", issue: "Missing og:title", threshold: "no <meta property="og:title">" }

The same string in your widget and in your agent’s context — no screenshot, no copy-paste.

Root causes

  • Only the <title> was set; og:* was skipped
  • The head is unmanaged
  • Assumed the platform would “figure it out”

The fix for Next.js

Set openGraph.title in metadata; it defaults to your title if omitted, so set it only when you want different copy.

tsx
export const metadata: Metadata = {
  openGraph: { title: 'Invoicing that pays you faster' },
}

Steps

  1. Write a short share-optimised headline
  2. Emit it as <meta property="og:title">
  3. Preview the card in a share debugger

See the general, framework-agnostic fix →

FAQ

Is og:title required if I already have a <title>?
Platforms fall back to <title>, so it is not strictly required — but setting og:title lets you write card-specific copy and avoid a truncated brand suffix.
How long can og:title be?
Keep it under ~60 characters. Cards truncate long titles, and a short punchy headline performs better.
Should og:title include my brand name?
On a share card, usually not. The card already shows the domain, so a bare “Invoicing that pays you faster” reads cleaner than “… | Acme”. Keep the brand suffix in your <title>, where the search result benefits from it.