Meta Tag Generator
Generate SEO meta tags, Open Graph, and Twitter Card tags for your website
Generated Meta Tags
<!-- Basic Meta Tags --> <meta name="robots" content="index, follow" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <!-- Open Graph / Facebook --> <meta property="og:type" content="website" /> <!-- Twitter Card --> <meta name="twitter:card" content="summary" />
How to Use Meta Tag Generator
- 1
Enter your page title, description, and target keywords.
- 2
Fill in Open Graph fields: og:title, og:description, og:image URL.
- 3
Add Twitter Card settings: card type, creator handle.
- 4
Preview how your page will appear in Google and social media.
- 5
Copy the generated HTML meta tags and paste them into your page's <head>.
How to Implement
1Add to HTML Head
- 1.Copy the generated meta tags from the output.
- 2.Open your HTML file and locate the <head> section.
- 3.Paste the meta tags inside <head>, before the closing </head> tag.
- 4.Ensure there are no duplicate meta tags already present.
- 5.Save and deploy your updated HTML file.
Tip: Place the canonical tag first, then title, description, Open Graph, and Twitter Card tags in that order for readability.
2Add to WordPress (Yoast SEO)
- 1.Open the page/post in the WordPress editor. Click the Yoast SEO icon in the top-right sidebar to open the Yoast panel.
- 2.SEO Tab: Click the 'SEO' tab. Enter your SEO title in the 'SEO title' field, and your meta description in the 'Meta description' field. Set your Focus keyphrase at the top.
- 3.Advanced Tab: Click the 'Advanced' tab. Set the Canonical URL if needed. Configure robots meta (index/noindex, follow/nofollow) using the dropdown options.
- 4.Social Tab: Click the 'Social' tab. Set the Facebook/Open Graph image, title, and description. Set the Twitter Card image, title, and description separately.
- 5.Click 'Update' or 'Publish' to save your changes.
Tip: In the latest Yoast SEO, the settings panel is in the editor sidebar (not a metabox below content). Click the Yoast icon at the top-right toolbar to access it.
3Add to WordPress (RankMath)
- 1.Open the page/post in WordPress editor.
- 2.Click the RankMath icon in the top-right toolbar.
- 3.Under 'Edit Snippet', paste your title and description.
- 4.Click the 'Social' tab to set Open Graph and Twitter Card values.
- 5.Update the page to save changes.
4Add to Next.js App Router
- 1.Open your page's layout.tsx or page.tsx file.
- 2.Export a metadata object: export const metadata = { title: '...', description: '...', openGraph: { ... }, twitter: { ... } }
- 3.For dynamic pages, use the generateMetadata() async function instead.
- 4.Next.js will automatically inject these into the HTML head at build/render time.
- 5.Verify by viewing page source in browser after deployment.
5Add to Shopify
- 1.Go to Shopify Admin > Online Store > Preferences for homepage meta tags.
- 2.For product/collection pages, edit the 'Search engine listing preview' section at the bottom of each item.
- 3.For custom Open Graph tags, edit your theme's theme.liquid file.
- 4.Add the OG/Twitter meta tags inside the <head> section of theme.liquid.
- 5.Save and preview your store to verify.
What is Meta Tag Generator?
A Meta Tag Generator creates the HTML meta tags that control how your webpage appears in search engines and social media previews. This includes the standard title and description tags for Google, Open Graph tags for Facebook and LinkedIn, and Twitter Card tags for Twitter/X. Proper meta tags directly impact your click-through rate from search results - a well-crafted meta description can mean the difference between someone clicking your link or your competitor's. This tool generates all the tags you need and shows you a real-time preview.
Features
- Standard SEO meta tags: title, description, keywords, robots
- Open Graph tags for Facebook, LinkedIn, and other social platforms
- Twitter Card tags with support for summary and large image cards
- Real-time SERP preview showing how Google will display your page
- Social media preview cards for Facebook and Twitter
- Viewport and charset tags for mobile optimization
- Copy all tags as a complete HTML snippet
Frequently Asked Questions
Why Use Creativism Meta Tag Generator?
Creativism Meta Tag Generator handles all your meta tag needs in one place. Instead of manually writing Open Graph, Twitter Card, and SEO tags separately, this tool generates everything with a real-time preview. As an SEO agency, we know that proper meta tags directly impact click-through rates from search results. Every percentage point improvement in CTR means more traffic from the same rankings. Get your meta tags right the first time.
Related Tools
Robots.txt Generator
Create robots.txt files to control search engine crawling
XML Sitemap Generator
Generate XML sitemaps for better search engine indexing
SERP Simulator
Preview how your page appears in Google search results
Keyword Density Checker
Analyze keyword frequency and density in your content
Schema Markup Generator
Generate JSON-LD structured data for FAQ, Article, Product, and more
Heading Tags Checker
Analyze H1-H6 heading structure of any webpage