Open Graph & Social Metadata Extractor

Open Graph & Social Metadata Extractor

An enterprise-grade, high-throughput Open Graph protocol extractor, Twitter/X Card auditor, Schema.org JSON-LD validator, and live social media preview health checker for BrowserMesh.

Discovers, extracts, parses, normalizes, and audits over 100+ metadata tag descriptors, Microdata entities, Dublin Core attributes, and live image/video assets across websites or URL lists. Simultaneously runs an automated 35+ rule diagnostic linter and simulates link card previews across 7 major platforms (Facebook/Meta, Twitter/X, LinkedIn, WhatsApp, Slack, Discord, and Bluesky/Fediverse).

The premier modern alternative to Metatags.io, Screaming Frog SEO Spider (£209/yr), Ahrefs, and legacy single-threaded metadata scrapers.

---

🎯 Target Audience & Industry Solutions

• Technical SEO Specialists & Web Quality Auditors: Instantly detect missing canonical tags, absent <title> tags, duplicate og:description strings, and malformed JSON-LD structured data blocks across thousands of catalog pages.
• Social Media Managers & Digital Marketers: Guarantee link cards display pixel-perfect previews on Facebook, Twitter/X, LinkedIn, and WhatsApp without cropped visuals, missing headlines, or broken placeholder boxes.
• Frontend Engineers & Jamstack Developers: Detect the "silent social preview failure epidemic" where client-rendered SPAs (Next.js, Remix, Vite, Vue, SvelteKit) render meta tags via client-side JavaScript, leaving non-JS social crawlers with blank preview cards.
• Content Marketers & Blog Publishers: Eliminate dead og:image URLs (404 Not Found), hotlinking 403 blocks, oversized images causing mobile chat unfurls to fail, and missing <meta property="og:image:alt"> accessibility tags.
• CI/CD & DevOps Automation Teams: Integrate social link auditing directly into automated staging builds to block deployments that would expose broken social metadata to customers.

---

🚀 Key Features

1. 100+ Tag Full-Spectrum Metadata Taxonomy

Extracts and structures metadata across all modern web standards:

• Open Graph Core Protocol: og:title, og:type, og:image, og:url, og:description, og:site_name, og:locale, og:locale:alternate, og:determiner, og:logo.
• Open Graph Media Sub-Properties: Grouped image properties (og:image:url, og:image:secure_url, og:image:type, og:image:width, og:image:height, og:image:alt), video properties (og:video:url, og:video:secure_url, og:video:type, og:video:width, og:video:height, og:video:duration), and audio properties (og:audio:url, og:audio:secure_url, og:audio:type).
• Vertical Type Metadata: Complete extraction for article:* (published_time, modified_time, author, section, tag), product:* (price:amount, price:currency, availability, condition, brand), profile:* (first_name, last_name, username, gender), book:* (author, isbn, release_date), and music:*.
• Twitter / X Cards: twitter:card, twitter:site, twitter:site:id, twitter:creator, twitter:title, twitter:description, twitter:image, twitter:player, twitter:app:*.
• Decentralized & PWA: Discord embed accent <meta name="theme-color"> and Fediverse <meta name="fediverse:creator">.

2. Multi-Tier Intelligent Fallback Synthesis

When authors fail to declare explicit Open Graph tags, the built-in fallback hierarchy synthesizes authoritative link cards:

• Title Fallback: og:title → twitter:title → meta[name="title"] → <title> → h1
• Description Fallback: og:description → twitter:description → meta[name="description"] → meta[itemprop="description"] → first <p>
• Image Fallback: og:image → twitter:image → meta[itemprop="image"] → link[rel="image_src"] → prominent in-page <img> → link[rel="apple-touch-icon"] → favicon
• Canonical URL Fallback: og:url → link[rel="canonical"] → request URL
• Site Name Fallback: og:site_name → meta[name="application-name"] → JSON-LD Organization / WebSite name → domain hostname

3. Live Media Reachability & Health Verification

Dispatches lightweight, non-blocking HTTP probes on declared og:image and twitter:image URLs:

• Confirms HTTP status code (200 OK vs 404 Not Found vs 403 Forbidden).
• Verifies MIME type validity (image/jpeg, image/png, image/webp, image/avif).
• Validates that images are not SVGs (which social platforms reject).
• Captures content length and validates against platform budgets (Twitter 5MB, WhatsApp 300KB).
• Flags mixed-content HTTP images on HTTPS pages.

4. 35+ Rule Diagnostic Linter & Social Readiness Scoring

Calculates a 0–100 Social Health Score and generates an actionable findings list categorized by severity (error, warning, suggestion):

• Facebook First-Share Blank Bug: Detects missing og:image:width and height, preventing Facebook's asynchronous first-share text-only glitch.
• Head Truncation Warning: Checks if tags are buried past Slackbot's 32KB or WhatsApp's 300KB cutoff.
• Aspect Ratio Linter: Checks adherence to the recommended 1.91:1 landscape standard.
• Length Linters: Identifies truncated titles (>90 chars) or descriptions (>300 chars).

5. 7-Platform Social Preview Simulation Matrix

Simulates link unfurling behavior across 7 major networks:

1. Facebook / Meta: Large card (1200x630) vs small square vs text fallback.
2. Twitter / X: summary_large_image vs summary square card.
3. LinkedIn: 1.91:1 landscape post card vs thumbnail.
4. WhatsApp: Fast mobile thumbnail (< 300KB image) vs text only.
5. Slack: Rich unfurl card vs compact link.
6. Discord: Colored embed card with theme-color accent border.
7. Bluesky & Fediverse: External card embed and Mastodon author attribution.

6. Triple-Engine Execution (auto / http / browser)

• HTTP Mode: Pure native Node.js HTTP pipeline (~200–400ms per URL) with Chrome desktop User-Agent, Brotli/Gzip decompression, and Cheerio DOM evaluation.
• Browser Mode: Full Playwright stealth Chromium (CloakBrowser) for client-rendered SPAs (Next.js client shells, React SPA, Vue, SvelteKit) and pages behind bot shields.
• Auto Mode (Default): Attempts high-speed HTTP check first; automatically escalates to stealth browser mode if bot challenges (403/503) or unhydrated SPA client shells are detected.

---

📊 Comparison with Alternatives

---

⚙️ How to Configure Your Job

---

📋 Output Fields Reference (19 Fields)

---

💡 Best Practices & Frequently Asked Questions

Why does my image show up on LinkedIn but not on WhatsApp?

WhatsApp requires image payloads to be strictly under 300 KB and in JPEG, PNG, or WebP format. WhatsApp also requires Open Graph tags to be located in the first 300KB of the HTML document. If your og:image is an 800 KB PNG or placed below heavy scripts, WhatsApp will fail silently and display text-only previews.

Why do first-time shares on Facebook appear without an image?

Facebook's crawler processes images asynchronously. Unless you explicitly provide <meta property="og:image:width" content="1200"> and <meta property="og:image:height" content="630">, Facebook cannot reserve space for the image card on the first share. Supplying explicit dimensions allows synchronous rendering on the very first share.

Are SVG images supported for social preview cards?

No. Major social platforms (Facebook, Twitter/X, LinkedIn, WhatsApp, Slack, Discord) do not render SVG files in link preview cards for security and rendering performance reasons. Always supply raster images (PNG, JPEG, or WebP).

Does this plugin execute JavaScript on Single Page Applications (Next.js, React, Vue)?

Yes. In 'auto' mode, if the plugin detects an empty client-rendered shell or missing <head> tags in the initial HTTP fetch, it automatically escalates to stealth Playwright Chromium (CloakBrowser) to extract the hydrated DOM. Furthermore, it flags SPA_METADATA_UNRENDERED to alert you that social crawlers (which do not run JavaScript) will not see those tags unless server-side rendering (SSR) is configured.