Social Preview Tool

Preview how your link looks on Facebook, X/Twitter, LinkedIn, Slack, and Discord before you publish.

Visual Studio Release Diff Regression Check Staging Check SEO Checker URL Debugger llms.txt Hreflang OG Image Social Meta JSON-LD Schema Markup Social Preview SERP Preview Robots.txt

Import existing tags

Paste HTML or upload an HTML file to pre-fill fields

Page URL

The full URL of the page. Used for previews and as a default for canonical.

Title Tag0/60

The <title> tag. Google truncates by pixel width (~580px). Aim for 50-60 characters.

Meta Description0/160

Shows in Google search results. Aim for 150-160 characters. Google truncates at ~920px.

Canonical URL

Defaults to your page URL if empty. Use when multiple URLs show the same content.

OG Type

The type of content. Most pages use "website" or "article".

og:title

Title for social cards. Leave empty to use your title tag.

og:description

Description for social cards. Leave empty to use your meta description.

og:image

Recommended: 1200×630px. Use an absolute URL.

Card Type

"summary_large_image" gives the biggest visual impact.

twitter:title

twitter:description

twitter:image

Falls back to your OG image if empty.

twitter:site

The site's X handle.

twitter:creator

The author's X handle.

Generated Output

Copy & paste into your site

HTML Head Tagshtml

<meta name="robots" content="index, follow" />
<meta http-equiv="content-language" content="en" />

<!-- Open Graph / Facebook -->
<meta property="og:type" content="website" />
<meta property="og:locale" content="en" />

<!-- Twitter / X Card -->
<meta name="twitter:card" content="summary_large_image" />

Live Preview

Updates as you type

example.com

Your Page Title

Your page description appears here. Edit your title and description on the left to see the Google preview update…

Description truncated by Google

Brand Profile

No brand profile yet.

Save This Page Setup

Save this page's SEO setup so you can return, tweak, and re-export without re-entering everything. Stored in your browser.

A social preview tool that shows how your link will appear on Facebook, X/Twitter, LinkedIn, Slack, and Discord — all at once, updating live as you edit your tags. See every platform's card before you publish, so you never share a broken or ugly preview again.

Why preview social cards before publishing

When you share a link on social media, the platform fetches your page and renders a preview card. If your Open Graph or Twitter Card tags are missing or wrong, the card will look bad — no image, wrong title, truncated description. Social platforms cache these previews aggressively, so fixing a broken card after publishing can take hours or days. Previewing first lets you catch problems before they are public.

Each platform is slightly different

Facebook uses og:title, og:description, and og:image. X/Twitter uses twitter:card, twitter:title, twitter:description, and twitter:image (falling back to OG tags). LinkedIn uses OG tags but renders the card slightly differently. Slack uses OG tags and shows a colored left border. Discord uses OG tags and renders in dark mode. SerpCraft shows all of these side by side so you can verify each one looks right.

How to force a re-scrape

If you have already shared a link and the preview is wrong, you need to force the platform to re-fetch your tags. Facebook: use the Sharing Debugger at developers.facebook.com/tools/debug/. LinkedIn: use the Post Inspector at linkedin.com/post-inspector/. X/Twitter: compose a new post and delete the old URL, then re-paste. Slack: use "Refresh preview" in the message menu. Discord: there is no official tool — the cache expires after a while.

Common preview problems and fixes

No image: use an absolute URL for og:image (https://example.com/image.png, not /image.png). Wrong title: check og:title and twitter:title — they override your <title> tag on social. Truncated description: keep og:description under 200 characters. Cached old preview: use the platform's debugger to force a re-scrape. Image loads on some platforms but not others: check CORS and ensure the image is publicly accessible without authentication.