PocketPlay
中文

Meta Tag Generator

Build the whole <head> block — title, description, canonical, Open Graph, Twitter card, favicons and JSON-LD — with live Google and social previews.

🔒 Runs in your browser — files never leave your deviceFree · No sign-up

Basic tags

Page title
Meta description
Canonical URL
Site name
Language code
Author
Robots
Theme colour
Keywords (optional)

Open Graph (Facebook, LinkedIn, Slack, Discord)

og:type
og:locale
Share image URL
Image alt text
Image size
×

Twitter / X card

twitter:card
twitter:site

Structured data (JSON-LD)

Template
Logo / image URL
Published date

Google result preview

🌐

Social card preview

No share image set

Generated <head> tags

How to generate meta tags

  1. Fill in the title, description and canonical URL. The Google preview on the right shows roughly how the result is cut off in search results.
  2. Add an Open Graph image (1200×630 works everywhere) plus a Twitter card type, and check the social preview underneath.
  3. Pick a JSON-LD template if you want structured data, then copy the whole block and paste it inside your page's <head>.

FAQ

How long should the title and description be?

Google renders roughly 580 px of title — about 55–60 Latin characters, or around 30 Chinese characters — and about 155–160 characters of description. The counters turn amber once you pass that, but longer text is not an error: it is simply truncated with an ellipsis.

Do I need both Open Graph and Twitter tags?

Not always. X/Twitter falls back to og:title, og:description and og:image when the matching twitter: tags are missing, so the one thing worth setting explicitly is twitter:card, which decides between a small thumbnail and a large banner. Facebook, LinkedIn, Slack, WhatsApp and Discord all read the Open Graph tags.

Where does the JSON-LD go?

Anywhere in the document — <head> is the usual place. It is a separate <script type="application/ld+json"> block, so it does not affect rendering. Test it with Google's Rich Results Test before you rely on it.