Open Graph Meta Generator
WebGenerate meta tags for SEO, Open Graph and Twitter cards with a live preview, so share links look right on social platforms and in search results pages.
<meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>My Awesome Page</title> <meta name="description" content="A short description of this page for SEO and search engine results."> <meta name="keywords" content="vue, nuxt, tools"> <meta name="robots" content="index, follow"> <link rel="canonical" href="https://example.com/page">
Related Tools
About Open Graph Meta Generator
When a link is shared on platforms like Twitter, Facebook, Slack, or messaging apps, they read the Open Graph and Twitter Card tags in the page <head> to build a preview card with a title, description, and thumbnail. This tool generates og:, twitter:, and basic SEO meta tag code at once from the title, description, image, URL, and type you provide, ready to copy into your template.
How to Use
- Open the Open Graph Meta Generator tool
- Enter or paste the content to process
- Adjust the output options as needed
- Click the Run button; results appear in real time
- Copy or export the result
Use Cases
- Optimize share cards — Generate og:title and og:image so article links show rich previews on social.
- Unify site metadata — Batch-produce description and og tags for new pages to keep conventions consistent.
- Multi-platform support — Output Open Graph and Twitter Card tags together to cover different channels.
- E-commerce landing — Configure previews with product image and price copy to lift click-through.
- Debug preview issues — Compare against standard tags to fix crawlers missing the image or title.
- AMP pages — Generate the required meta tags for Accelerated Mobile Pages to ensure they validate and appear in search.
- Theme templates — Produce a reusable meta tag snippet for a CMS theme so every new page inherits correct OG defaults.
FAQ
What size should og:image be?
Most platforms recommend 1200x630 px (about 1.91:1) and a modest file size. The image needs a publicly accessible absolute URL, or crawlers cannot fetch it and the card shows blank.
Why does the share preview not update?
Platforms cache crawl results. After editing, force a re-scrape with the platform's debugger (such as Facebook's sharing debugger) or wait for the cache to expire.
Do Open Graph and meta description conflict?
No, they serve different purposes: description feeds search snippets, og:description feeds social cards. Fill both, with content that can differ slightly in emphasis.
Are twitter: tags required?
Twitter/X falls back to Open Graph tags when twitter: tags are absent, but setting twitter:card explicitly gives finer control over the card style (large image or summary).
Do these tags affect search ranking?
og tags are not a direct ranking factor, but better previews boost clicks and sharing. Meanwhile title and description shape the search snippet and indirectly affect click-through.