Open Graph & Social Preview

Open Graph & Social Preview

Preview how your page looks when shared on Facebook, LinkedIn and X.

What is Open Graph & Social Preview?

The Open Graph & Social Preview tool reads a page's Open Graph and Twitter Card tags and shows live how it will look when shared on Facebook, LinkedIn and X. You instantly see whether the title, description and image are correct or missing, so your shares look professional.

Open Graph & Social Preview

How to use it

  1. 1Enter the address (URL) of the page you want to preview.
  2. 2Review the social card preview for Facebook, LinkedIn and X.
  3. 3Spot and fix missing or wrong Open Graph / Twitter tags.

How to read the result

og:title and og:description
The basicsWithout them the platform guesses from the page and usually picks poor text.
og:image 1200×630
The field that matters mostThe image is what people notice. A missing or tiny image cuts click-through sharply.
Image size
Under 5 MBLarge files fail to load on some platforms and the card renders without an image.
Text inside the image
CarefulCards shrink on small screens; text baked into the image can become unreadable.
After you change it
CachingFacebook and LinkedIn keep the old card; refresh it through their own debugging tools.

When to use it

Pre-Publishing Blog Audit

Content marketers verify that post titles do not truncate on mobile screens and featured images display with sharp dimensions before distributing articles across networks.

E-Commerce Flash Sales

Store managers confirm promotional product pages showcase current discount banners and accurate seasonal descriptions rather than outdated cached metadata before launching campaigns.

Site Migration Audits

Developers migrating to a new CMS check whether dynamic meta tags generate properly instead of defaulting to a site-wide generic logo across every single URL.

Common mistakes

Using Relative Image URLs

Setting og:image to a relative path prevents crawler bots from discovering your media asset. Always specify a fully qualified absolute URL starting with https://.

Providing Square Ratio Assets

Using 1:1 square assets instead of the recommended 1200×630 landscape ratio leads to awkward cropping, grey letterboxing, or low-res thumbnail rendering on feeds.

Oversized Media Files

Social crawlers frequently drop image assets that exceed 5 MB due to network timeouts. Compress your visual creative below 1 MB to guarantee instant rendering.

Frequently asked questions

What are Open Graph tags for?

Open Graph tags (og:title, og:description, og:image) define the title, description and image that appear when your page is shared on social media.

Why doesn't my share image show?

The og:image tag may be missing, the image too small, or the platform's cache stale; the recommended size is 1200×630 pixels.

What's the difference between Twitter Card and Open Graph?

X (Twitter) primarily uses Twitter Card tags and falls back to Open Graph if they're absent; defining both is the safest approach.

Do WhatsApp and Telegram parse Open Graph meta tags?

Yes, both messaging apps parse standard og:title, og:description, and og:image tags for previews. However, WhatsApp requires image files to stay under 300 KB; heavier assets are omitted entirely, leaving you with plain text links instead of rich visual previews.

Can I use WebP or SVG files for og:image?

No, you should strictly avoid SVG because major social platforms do not render it for security reasons. While WebP support is growing, Twitter and LinkedIn still struggle to process it reliably. Always stick with JPG or PNG for broad compatibility.