How to use the meta tag generator
- Type the Page title and Meta description. The counters and Google preview show how they may look.
- Add the Canonical URL, the one full address you want indexed, then choose Indexing and Link following.
- Under Open Graph set og:type, og:site_name and the og:image URL. Leave og:title, og:description and og:url blank to reuse your page details.
- Under X pick the twitter:card type. The other twitter fields can stay blank because X reuses your Open Graph values. Tick the box under them to write those tags anyway.
- Optional: pick a picture in Preview image to check its size and crop. It stays on your device.
- Press Copy HTML and paste the tags inside the
<head>of your page.
How the tags are built
The title and description follow Google's title link and snippet documentation. Google sets no length limit and cuts results to fit the device width, so the counters are guides: about 60 characters (roughly 600 pixels) for a title and 155 for a description. Google also rewrites titles and snippets when other text fits better.
The Open Graph tags follow the Open Graph protocol, which requires og:title, og:type, og:image and og:url. The tool adds og:description, og:site_name and og:image:alt. X reads the og values when a twitter tag is missing, but twitter:card has no Open Graph equivalent, so it is always written (see X's cards markup reference). Google treats a missing robots tag as no restrictions.
Worked example with the default inputs
The page loads with a sample sourdough recipe. The title is 53 characters (about 510 px) and the description is 135. The first block of the output reads:
<!-- Basic meta tags -->
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Sourdough Bread Recipe for Beginners | Example Bakery</title>
<meta name="description" content="Bake a crusty sourdough loaf at home with this step-by-step beginner recipe, including a simple starter guide and troubleshooting tips.">
<meta name="author" content="Example Bakery">
<meta name="robots" content="index, follow">
<link rel="canonical" href="https://example.com/sourdough-bread">The Open Graph block reuses the title, description and URL and adds the image address and alt text. The X block is one twitter:card line, for 15 tags in all.
Limits and edge cases
- Addresses must start with http:// or https:// and contain no spaces. A bad one is flagged and left out of the code.
- The previews cannot load remote images, so pick a file from your device. The og:image address you type is still written into the tags.
- A
noindextag only works if robots.txt does not block the page, because crawlers must read the tag to obey it.
Frequently asked questions
How long should a title tag and meta description be?
Google has no fixed limit, but it shortens results to fit the screen. Keep titles near 60 characters (about 600 pixels) and descriptions between 120 and 155 characters.
Do meta keywords still matter for SEO?
No. Google states that the meta keywords tag is not used for indexing or ranking. Leave the field empty and spend the time on the title and description instead.
Do I need both Open Graph and X card tags?
Usually the Open Graph tags plus one twitter:card tag are enough, because X reuses og:title, og:description and og:image. Add the other twitter tags only when you want different text or a different image on X.
What size should an og:image be?
Facebook recommends at least 1200 by 630 pixels at about a 1.91 to 1 ratio, with a minimum of 600 by 315 and a file under 8 MB.
Why does my social preview not update after I change the tags?
Platforms cache the first copy they fetch. Scrape the link again in the Facebook Sharing Debugger, or add a changed query string to force a fresh fetch.
Test a live page with the Open Graph preview, set crawler rules with the robots.txt generator, and shrink the share image with the image compressor.