Loading...
Create and Manage SEO Meta Tags, Open Graph & Twitter Cards
A comprehensive tool for creating and managing SEO metadata, Open Graph tags, Twitter Cards, and structured data for your website. Perfect for optimizing how your content appears in search engines and social media.
The SEO Metadata Editor helps you create comprehensive meta tags for your website. Whether you are building a new site or optimizing an existing one, this tool provides everything you need for optimal search engine and social media visibility.
The Basic Metadata section covers the fundamental SEO elements that every webpage should have. These tags are essential for search engine indexing and basic browser functionality.
The title that appears in search results and browser tabs.
A brief summary that appears in search results below the title.
The tool automatically validates character counts and provides visual feedback. Green indicators show optimal length, while warnings appear for titles or descriptions that are too long.
Comma-separated list of relevant keywords
Content author name
Preferred URL to prevent duplicate content issues
Control search engine indexing behavior
Open Graph protocol tags control how your content appears when shared on Facebook, LinkedIn, and other social platforms. Proper Open Graph configuration significantly improves click-through rates from social media.
Use the "Copy from Basic" button to automatically populate Open Graph title, description, and URL from your basic metadata.
Open Graph images should be 1200x630 pixels (1.91:1 aspect ratio) and under 500KB for optimal social media display. The tool automatically validates image URLs and analyzes dimensions.
Twitter Cards provide a rich way for your content to be displayed when shared on Twitter/X. Configure these tags to ensure your links stand out in the Twitter timeline.
Small image card
Large featured image
Mobile app promotion
Video/audio content
Use the "Copy from OG" button to quickly populate Twitter Card fields with your Open Graph data. This ensures consistency across platforms while allowing platform-specific customization.
Structured data helps search engines understand your content better and can enable rich results in search. The tool supports JSON-LD format with built-in templates for common content types.
Basic website schema
Blog post or news article
Business or organization
E-commerce product
Navigation breadcrumb
The editor validates your JSON-LD in real-time and displays validation status. Use the Format button to auto-format your code.
Links to Google Rich Results Test and Schema.org Validator for verifying your structured data implementation.
Configure icons for browser tabs, bookmarks, and mobile device home screens. Proper icon configuration improves brand recognition and user experience.
Browser tab and bookmark icons
16x16 or 32x32 pixelsiOS home screen icon
180x180 pixels16x16, 32x32180x180192x192, 512x512144x144Add verification codes for search engine webmaster tools to prove ownership of your website and access additional tools and data.
Add your Google site verification meta tag
Add Bing validation code
Add Pinterest verification
Configure additional meta tags for viewport, theme color, character encoding, and other advanced settings.
Control how your site displays on different devices. Essential for mobile responsiveness.
Browser UI color on mobile devices and tab colors.
Set your page character set (UTF-8 recommended).
Specify the primary language of your content.
The preview panel on the right side shows how your metadata will appear in different contexts. Switch between Google search preview, social media previews, and code view.
See how your page appears in Google search results with title and description.
Preview Facebook/LinkedIn Open Graph cards and Twitter Cards.
View and copy the generated HTML meta tags organized by category.
The SEO Score panel evaluates your metadata configuration and provides a numerical score with improvement recommendations.
Title Length
Description
Open Graph
Twitter Cards
Export your metadata in multiple formats suitable for different frameworks and platforms.
Standard HTML meta tags ready to paste in your page <head>
Extension: .htmlNext.js 13+ metadata object for App Router pages
Extension: .tsReact Helmet component for SPA applications
Extension: .jsxTypeScript configuration interface
Extension: .tsRaw metadata as JSON object
Extension: .jsonimport type { Metadata } from 'next';
export const metadata: Metadata = {
title: 'Your Page Title',
description: 'Your meta description',
openGraph: {
title: 'OG Title',
description: 'OG Description',
images: [{ url: 'https://example.com/og-image.jpg' }],
type: 'website',
},
twitter: {
card: 'summary_large_image',
title: 'Twitter Title',
images: ['https://example.com/twitter-image.jpg'],
},
};Speed up your workflow with these keyboard shortcuts:
| Action | Shortcut |
|---|---|
| Save / Export | Ctrl / Cmd + S |
| Export | Ctrl / Cmd + E |
| Undo | Ctrl / Cmd + Z |
| Redo | Ctrl / Cmd + Y |
| Toggle Preview Panel | Ctrl / Cmd + P |
| Show Shortcuts | ? |
| Switch Sections (1-7) | 1 - 7 |