Open Graph Tag Generator

When someone shares a link on Facebook, LinkedIn, Slack or WhatsApp, the platform reads a cluster of <meta property="og:…"> tags from the page head to build the preview card. Without them, the platform picks a random image and the first paragraph it finds. This tool generates the complete tag set (Open Graph plus Twitter/X Card) from a single form.

Fill in the fields, copy the output, and paste it inside your page’s <head> element. Every tag the tool emits is valid HTML5. No JavaScript, no server, no upload.

Worked Example: a Tech Blog Article

The first Load Sample click fills the form with an article scenario: title “How to Build a REST API with Node.js and Express” (48 chars, green badge), description “Learn to build a production-ready REST API using Node.js, Express and MongoDB…” (130 chars, within the 160-char limit), URL and image pointing to example.com. The output panel shows og:type set to article, all core tags, plus twitter:card set to summary_large_image with the Twitter title and description mirroring the OG values because the override fields were left blank.

What Each Property Controls

• og:type: seven presets: website, article, product, video.movie, music.song, music.album, profile. Choosing article reveals the article-specific fields (article:author, article:published_time, article:section) and hides them for every other type.
• og:title / og:description: character-count badges turn green when within the recommended limits (60 chars for title, 160 for description) and red when over. Facebook truncates anything longer in the card preview.
• og:image: must be an absolute HTTPS URL; the tool flags a non-HTTPS value with an inline warning because Facebook silently refuses insecure image URLs. Recommended size is 1 200 × 630 px. The minimum Facebook accepts is 200 × 200 px.
• og:image:alt: required for accessibility. Screen readers announce this text when the preview image is described.
• twitter:title / twitter:description / twitter:image: leave these blank and the tool mirrors the OG values. Fill them in only when you want different card text on Twitter/X than on Facebook.
• twitter:site / twitter:creator: both expect an @handle with the leading @. Twitter/X uses these to attribute the card to the site account and the author.
• og:locale: follows the BCP 47 pattern with an underscore: en_US, not en-US. A hyphen is valid per the OGP spec but some parsers reject it; the tool always emits the underscore form.

Tricky Inputs: Caching, Platform Rules and Locale Format

• Facebook caches OG data for up to 24 hours after the first scrape. Deploying updated tags does not refresh the card immediately. Use Facebook’s Sharing Debugger at developers.facebook.com/tools/debug to force a re-scrape. LinkedIn has a similar tool at linkedin.com/post-inspector.
• Twitter/X re-fetches cards on each new tweet for unseen URLs; already- published tweets keep the old card indefinitely.
• Slack enforces a 2 MB file-size ceiling on og:image. Images above that limit are silently dropped and the card shows no image.
• WhatsApp reads only og:title, og:description and og:image. The og:type and article-specific tags are ignored entirely by WhatsApp’s link previewer.