Open Graph Tag Generator
Generate Open Graph and Twitter Card meta tags with a live link-preview mockup — control how your page looks when shared on Facebook, WhatsApp and X.
About the Open Graph Tag Generator
The Open Graph Tag Generator builds the complete set of OG and Twitter Card meta tags that control how your page appears when shared on Facebook, WhatsApp, LinkedIn, X and most chat apps. Fill in the title, description, URL, image and type, and copy the ready-to-paste HTML block.
The live preview card mimics a real link preview — image, title, description and domain — so you can see roughly what people will get in their feed before you deploy. Without OG tags, platforms guess: they grab an arbitrary image and truncate random text, which kills click-through rates.
All tags are properly escaped, and image dimension hints (og:image:width/height) are included so Facebook can render the full-size preview on the very first share instead of after a re-scrape.
How to Use the Open Graph Tag Generator
- 1Enter your page title, description and URL.
- 2Add an image URL (1200 × 630 px works everywhere) and pick the content type.
- 3Check the live preview card to see how the share will look.
- 4Copy the generated tags into your page's <head>.
Frequently Asked Questions
What size should an Open Graph image be?
1200 × 630 pixels (1.91:1 ratio) is the safe standard — Facebook, LinkedIn and WhatsApp all render it full-width. Keep the file under ~1 MB and put key content near the center, since some apps crop edges.
Why doesn't WhatsApp show my link preview?
WhatsApp reads og:title, og:description and og:image from the page's initial HTML. Make sure the tags are server-rendered (not injected by client-side JS), the image URL is absolute and publicly reachable, and the image isn't too large.
Do I need separate Twitter Card tags if I have Open Graph tags?
X falls back to OG tags for most fields, but you need at least twitter:card to choose the layout. This generator outputs both blocks, so the preview is correct everywhere.
How do I refresh Facebook's cached preview after changing tags?
Facebook caches scrapes per URL. Paste your URL into the Facebook Sharing Debugger and click 'Scrape Again' — the new tags take effect immediately.
Which og:type should I use?
Use 'website' for home and landing pages, 'article' for blog posts and news (it enables published-time metadata), 'product' for product pages and 'profile' for personal pages.