Meta / OG Tag Generator

Generate title, description, canonical, OG, and Twitter Card meta tag HTML.

Category: Dev Tools

When to use?

Use it before deploying a new page to put the search title and description, canonical URL, and social share preview info into the head. Draft basic SEO tags for blog posts, landing pages, and tool pages at once.

How to use

  • Enter the page title and description.
  • Enter the canonical URL and OG image address.
  • Choose Robots and Twitter Card settings.
  • Paste the generated HTML into the head tag.

Input Explanation

Enter the title, description (160 chars or less recommended), canonical URL, OG image URL, Twitter Card type, and Robots directive.

Calculation Basis

It combines Primary SEO, Open Graph, and Twitter Card meta tags into code for the HTML head. canonical and og:url should use the same canonical URL.

Usage Examples

  • Optimize social sharing - Precisely control the title, description, and image in messenger, Facebook, and X link previews.
  • Write basic search tags - Quickly compose title, description, canonical, and robots tags for the page head.
  • Prepare PR review material - Paste a new page's SEO tag draft into a PR description or deploy checklist.

Examples

  • <title>…</title> + meta description + og:title + twitter:card output together
  • Enter a post title, description, and cover image → SEO and share meta tags at once
  • Choose robots noindex → tags for a test page excluded from search

Cautions

  • Generated output is for reference; test carefully before production use.
  • Use the same canonical URL for sitemap, canonical, and og:url.

Guides

Basic SEO tags

title and description affect search results most. Use a unique title and description per page, with key content at the front of the description.

Open Graph tags

og:title, og:description, og:image, and og:url are used in link share previews. Prepare the cover image at about 1200x630 for stable results across platforms.

Canonical normalization

The canonical URL tells search engines the representative address. If sitemap URL, canonical, and og:url differ, they may be seen as duplicates, so use the same canonical URL.

Robots directive

Use index,follow for public search pages; consider noindex,follow for terms, contact, or test pages with low need to appear directly in search.

FAQ

What OG image size is best?

1200×630px (16:9) is recommended.

Is there a preview?

You can see and copy the meta tag code generated from your title/description.

Which tags are generated?

Basic SEO tags like title and description plus og: social share tags.

Why is the canonical URL needed?

It tells search engines the representative URL when the same content opens at several URLs. Keep sitemap, canonical, and og:url the same.

Related Tools

  • URL Parser - Break a URL into protocol, host, path, and query.
  • UTM Parameter Builder - Add UTM parameters to a URL to build a marketing campaign tracking link.
  • HTML Formatter - Tidy HTML markup with consistent indentation and line breaks.
  • Markdown → HTML Converter - Convert a Markdown document to HTML with a rendered preview.
  • JSON Formatter - Beautify or minify JSON strings instantly and check for validity errors.
  • UUID Generator - Generate up to 20 cryptographically secure UUID v4 values at once.