Open Graph Generator
Generate Open Graph tags for social media
Recomendado: 1200x630 píxeles
Vista previa
ejemplo.com
Título de la página
Descripción de la página...
Título de la página
Descripción de la página...
ejemplo.com
Open Graph Generator - Create Social Media Meta Tags
What is Open Graph and why is it essential for social sharing?
Open Graph (OG) is a protocol Facebook created in 2010 that defines how web content appears when it is shared on social networks. Without OG, Facebook, LinkedIn and WhatsApp scrape whatever they can from your page, often with ugly or plainly wrong results. With OG you control exactly the title that appears (og:title), the description (og:description), the featured image (og:image) and the content type (og:type). Twitter has its own system in Twitter Cards but falls back to OG. Implementing OG properly raises engagement dramatically whenever someone shares your content.
The anatomy of Open Graph meta tags
The essential OG tags are og:title (the sharing headline, which may differ from the SEO <title>), og:description (the social description, up to about 200 characters), og:image (an absolute image URL, ideally 1200x630 pixels for Facebook), og:url (the canonical URL of the page), og:type (website, article, product, profile, video and so on) and og:site_name. Articles add article:published_time and article:author, while products add product:price and product:currency. This tool generates every tag you need and previews how they will look.
Twitter Cards: how they differ from and complement Open Graph
Twitter Cards extend OG with platform-specific features. twitter:card sets the format (summary, summary_large_image, or player for video), and twitter:site carries your Twitter handle. Image dimensions differ too: summary wants at least 120x120 pixels while summary_large_image expects a 2:1 ratio. Twitter reads OG as a fallback, so if you define og:title it will be used whenever no twitter:title exists. The recommendation is to define both sets of tags for full control. Player cards require Twitter approval before embedded video works.
If you work with this tool, you will probably also find these useful Slug Generator, Gradient Generator, Flexbox Generator, Regex Tester.
Frequently asked questions
Why does Facebook or LinkedIn show the wrong image?
The usual causes are an image that is too small (200x200 pixels minimum, 1200x630 recommended), a relative image URL instead of an absolute one, an image blocked by robots.txt, or a cached earlier version held by the network. Use the Facebook Sharing Debugger to force a re-scrape and see the specific errors.
Can I use a different image for each social network?
Yes. Define og:image for Facebook, LinkedIn and WhatsApp, and twitter:image with a separate asset optimised for Twitter. Each network reads its own tag. That is genuinely useful because the ideal aspect ratios differ: Facebook prefers 1.91:1 while Twitter summary_large_image prefers 2:1.
How do I preview my link before sharing it?
Use the official tools: the Facebook Sharing Debugger at developers.facebook.com/tools/debug, the Twitter Card Validator and the LinkedIn Post Inspector. They show the exact preview plus any errors in your tags, and they also force the networks to refresh their cached copy of your page.
Do Open Graph tags affect Google SEO?
Only indirectly. Google does not use OG for ranking, but well presented content earns more clicks and shares, which can translate into backlinks and traffic, and those do affect SEO. Google also occasionally uses og:image for image results. Implementing OG is good practice even though the direct SEO benefit is small.