How to use Meta tag and social preview generator
- Enter the page's title, description, address and share image.
- Watch the Google and social previews, and follow the checks until the title and description fit.
- Copy the tags into your page's <head>.
How your page looks before anyone clicks
When a page appears in Google results or is shared in WhatsApp, LinkedIn, Slack or X, people see a headline, a short description and often an image, taken from tags in the page's head. If they're missing, apps guess, often badly: a cookie notice as the description, a logo cropped into a square, or nothing at all. This tool writes the full set of tags and shows you, as you type, how the page will look in a Google result and in a social card, so you can fix it before you publish.
Measured the way Google measures
Google doesn't cut titles at a fixed number of characters: it cuts them by width, at about 600 pixels for titles and about 920 pixels for descriptions on desktop. A title full of wide letters like W and M runs out sooner than one with narrow letters like i and l. The tool measures your text in the same font and size Google uses and warns you when it would be cut off, and the preview shows exactly where the ellipsis would fall.
Other checks catch the common mistakes: a missing description, a share image given as a relative path that apps can't load, an http address instead of https, and missing alt text for the image.
What you get
The output is ready to paste into your page's head: the title and meta description, a canonical link, Open Graph tags for Facebook, LinkedIn, WhatsApp, Slack, Discord and iMessage, the X card tag, and JSON-LD structured data describing the page as a web page, an article with author and publication date, or a product. Values are escaped so quotes and ampersands in your text can't break the HTML, and the structured data can't end its script element early.
For the share image, 1200 by 630 pixels works everywhere: it's the size Facebook and LinkedIn recommend, and X shows it as a large card.
Private
Everything is generated in your browser, so drafts of unreleased pages stay private. The share image isn't fetched for the preview unless you choose to load it, because loading it contacts the site that hosts it.
Questions
- How long should a title and description be?
- Google cuts titles at about 600 pixels wide, roughly 50 to 60 characters, and descriptions at about 920 pixels on desktop, roughly 155 characters. Because the limit is in pixels, wide letters like W and M use it up faster; the tool measures the actual width.
- Which tags do social apps read?
- Facebook, LinkedIn, WhatsApp, Slack, Discord and iMessage read Open Graph tags (og:title, og:image and so on). X reads its own twitter:card tag and falls back to Open Graph for the rest, so the tags aren't duplicated.
- What is the JSON-LD for?
- It's structured data that tells search engines what the page is: a web page, an article with its author and date, or a product. It can make a page eligible for richer search results.