RubanTools

Open Graph & Social Preview

Fill in your Open Graph tags and preview how your link card will look when shared on Facebook, Twitter/X and LinkedIn.

OG Tag Values
Recommended: 1200×630 px for Facebook; 800×418 px for Twitter

Generated Meta Tags:


                        
                    
Facebook / LinkedIn Preview
Twitter / X Preview

OG Preview - Open Graph and Social Media Preview

Open Graph (OG) is a protocol introduced by Facebook in 2010 that allows web pages to control how their content appears when shared on social media platforms. By adding specific meta tags to the HTML head section - og:title, og:description, og:image, and og:url - developers can ensure that link previews on Facebook, LinkedIn, WhatsApp, and Telegram display a curated image and text rather than auto-extracted content that may be incomplete or irrelevant.

Why OG Tags Matter for Indian Businesses

India has over 450 million Facebook users and 535 million WhatsApp users as of 2024, making social link sharing a critical traffic source for Indian news portals, e-commerce websites, real estate platforms, and political campaign pages. Poorly configured OG tags result in broken previews - blank images, truncated titles, or wrong descriptions - which significantly reduce click-through rates. Research by Buffer found that posts with optimised OG images get 2x more engagement than those with auto-extracted thumbnails.

Twitter Cards and LinkedIn

Twitter (now X) uses its own card system alongside OG, with tags like twitter:card, twitter:title, and twitter:image. LinkedIn reads standard OG tags. This preview tool lets you fill in all key meta tag values and instantly see how your link will render on Facebook, Twitter/X, and LinkedIn - catching formatting issues before publishing. Recommended OG image size is 1200x630 pixels for optimal display across all platforms.

Open Graph Questions

Open Graph meta tags control how a webpage appears when shared on social media (Facebook, LinkedIn, WhatsApp, Twitter/X). Key tags: og:title (the headline), og:description (the summary), og:image (the preview image), og:url (the canonical URL). Without OG tags, social platforms guess what to show - often incorrectly.

For Facebook and LinkedIn: 1200×630 pixels (1.91:1 ratio). For Twitter large card: at least 800×418 pixels (2:1 ratio). For Twitter small card: square image at least 144×144 pixels. Images must be served over HTTPS and publicly accessible.

The HTML title tag is shown in browser tabs and Google search results. og:title is shown in social media link previews - they can be different. The og:title can be more engaging. Similarly, og:description is separate from the meta description used by Google search.

twitter:card specifies how a link preview appears on Twitter/X. summary_large_image shows a large rectangular image above the title (best for articles). summary shows a small square thumbnail beside the title (for general pages). Always include twitter:title, twitter:description, and twitter:image alongside the card type.

Facebook, LinkedIn, and WhatsApp use og: tags. Twitter/X uses twitter: tags but also falls back to og: tags if twitter: tags are absent. Best practice is to include both - our tool generates both sets simultaneously. LinkedIn and WhatsApp use og: tags for their link previews.