Meta Tag Generator
Generate complete HTML meta tags for SEO and social sharing. Preview how your page looks in Google, Facebook, and Twitter.
Related Tools
How to Use
- Enter Page Details — Fill in your page title (60 chars max for Google), meta description (160 chars max), page URL, and share image URL. Optional: site name, author, keywords, and robots directive.
- Preview Across Platforms — See live previews of how your page will appear in Google search results, Facebook shares, and Twitter cards. The previews update in real-time as you type. Character counters show title and description length with color warnings.
- Copy the Tags — Click Copy Meta Tags to copy the complete HTML code including title, meta description, canonical, Open Graph, and Twitter Card tags. Paste directly into your page's <head> section.
About the Meta Tag Generator
WritePadPro's Meta Tag Generator creates the complete set of HTML meta tags needed for proper search engine optimization (SEO) and social media sharing. Enter your page details once, and get properly formatted title, meta description, canonical URL, Open Graph, and Twitter Card tags — ready to paste into your page's <head> section.
Why Meta Tags Matter
- Title tag — The most important on-page SEO signal. Displayed as the clickable blue link in Google search results. Should be under 60 characters and contain your primary keyword.
- Meta description — Displayed below the title in search results. Does not directly affect rankings but significantly impacts click-through rate. Should be 150-160 characters with a compelling summary.
- Canonical URL — Tells search engines which URL is the "official" version of a page, preventing duplicate content issues. Essential for pages accessible via multiple URLs.
- Open Graph — Controls how your page appears when shared on Facebook, LinkedIn, WhatsApp, Slack, Discord, iMessage, and hundreds of other platforms that support OG tags.
- Twitter Card — Controls how your page appears when shared on Twitter/X. Choose between a large image card (prominent image above text) or summary card (small image beside text).
Live Platform Previews
The generator shows three live previews that update as you type:
- Google SERP — A mockup of how your page appears in Google search results, with proper title truncation (at ~60 chars), URL display, and description truncation (at ~160 chars).
- Facebook Share — Shows the share card with your OG image, title (bold), description, and site name exactly as it would appear in a Facebook post or message.
- Twitter Card — Shows either the large image card (image above) or summary card (image beside) based on your selected twitter:card type.
Character Counters
Real-time character counters for both title and description change color based on length: green when within ideal range, amber when approaching the limit, and red when over the limit. This helps you optimize for search result display without guessing.
Additional Options
Beyond the core tags, the generator supports: meta keywords (largely ignored by Google but used by some other search engines), meta author, robots directive (index/noindex, follow/nofollow), og:type (website, article, product, etc.), twitter:card type (summary or summary_large_image), and optional charset and viewport tags.
Privacy
All generation happens in your browser. Your page title, description, URL, and image URL are never sent to any server. The platform previews are CSS mockups rendered locally — they do not make requests to Google, Facebook, or Twitter.
Frequently Asked Questions
What tags does this generator create?
It generates a complete set: charset, viewport, title tag, meta description, meta keywords (optional), meta author (optional), robots directive, canonical URL, Open Graph tags (og:type, og:title, og:description, og:url, og:image, og:site_name), and Twitter Card tags (twitter:card, twitter:title, twitter:description, twitter:image). All standard tags needed for proper SEO and social sharing.
What is the ideal title length?
Google displays approximately 50-60 characters of a title tag in search results. The counter turns green under 50, amber at 50-60, and red over 60. Aim for under 60 characters with your primary keyword near the beginning. The title tag is the single most important on-page SEO element.
What is the ideal meta description length?
Google typically shows 150-160 characters. The counter turns green under 140, amber at 140-160, and red over 160. Write a compelling summary that includes your target keyword and a call to action. While meta descriptions do not directly affect rankings, they significantly impact click-through rates from search results.
How do the social previews work?
The Google preview simulates how your page appears in search results with the truncated title, URL, and description. The Facebook preview shows the share card with your OG image, title, description, and site name. The Twitter preview shows either a large image card or summary card based on your twitter:card selection. All previews update live as you edit.
What is Open Graph and why do I need it?
Open Graph (OG) tags control how your page appears when shared on Facebook, LinkedIn, WhatsApp, Slack, Discord, and many other platforms. Without OG tags, these platforms guess what title, description, and image to show — often incorrectly. With proper OG tags, you control the exact appearance of every share. The og:image tag is especially important as it provides the share card image.
Is my data sent to a server?
No. All tag generation and previews are rendered locally in your browser using JavaScript. Your page title, description, URL, and image URL are never transmitted to any server. The previews are CSS mockups, not actual platform renders.