{"id":47,"date":"2026-06-25T07:39:20","date_gmt":"2026-06-25T07:39:20","guid":{"rendered":"https:\/\/toolskit.site\/index.php\/meta-tag-generator\/"},"modified":"2026-06-25T07:39:20","modified_gmt":"2026-06-25T07:39:20","slug":"meta-tag-generator","status":"publish","type":"page","link":"https:\/\/toolskit.site\/index.php\/meta-tag-generator\/","title":{"rendered":"Meta Tag Generator"},"content":{"rendered":"<div class=\"hth-single-tool-shell\" style=\"--hth-color:#00f5ff\">\n<div id=\"mtg-wrapper\">\n<style>\n    #mtg-wrapper * { box-sizing: border-box; margin: 0; padding: 0; font-family: system-ui, -apple-system, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif; }\n    #mtg-wrapper { background: radial-gradient(circle at 30% 20%, #1a1a2e 0%, #0f0f1a 40%, #05050a 100%); color: #e0e0e0; padding: 24px; border-radius: 16px; border: 1px solid rgba(0, 245, 255, 0.15); box-shadow: 0 0 30px rgba(0, 245, 255, 0.05), inset 0 0 60px rgba(0,0,0,0.3); position: relative; overflow: hidden; max-width: 1200px; margin: 0 auto; }\n    #mtg-wrapper::before { content: \"\"; position: absolute; top: -50%; left: -50%; width: 200%; height: 200%; background: conic-gradient(from 0deg, transparent, rgba(0, 245, 255, 0.03), transparent, rgba(176, 38, 255, 0.03), transparent); animation: mtg-rotate 15s linear infinite; z-index: 0; }\n    @keyframes mtg-rotate { 100% { transform: rotate(360deg); } }\n    #mtg-wrapper .mtg-content { position: relative; z-index: 1; }\n    #mtg-wrapper .mtg-header { text-align: center; margin-bottom: 24px; }\n    #mtg-wrapper .mtg-title { font-size: 28px; font-weight: 800; background: linear-gradient(90deg, #00f5ff, #b026ff); -webkit-background-clip: text; -webkit-text-fill-color: transparent; margin-bottom: 8px; }\n    #mtg-wrapper .mtg-subtitle { color: #888; font-size: 14px; }\n    #mtg-wrapper .mtg-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }\n    @media (max-width: 900px) { #mtg-wrapper .mtg-grid { grid-template-columns: 1fr; } }\n    #mtg-wrapper .mtg-panel { background: #0a0a12; border: 1px solid #222; border-radius: 12px; padding: 20px; }\n    #mtg-wrapper .mtg-panel-title { font-size: 16px; color: #00f5ff; margin-bottom: 16px; font-weight: 700; display: flex; align-items: center; gap: 8px; }\n    #mtg-wrapper .mtg-field { margin-bottom: 16px; }\n    #mtg-wrapper .mtg-label { display: flex; justify-content: space-between; font-size: 13px; color: #aaa; margin-bottom: 6px; font-weight: 600; }\n    #mtg-wrapper .mtg-counter { font-weight: 700; }\n    #mtg-wrapper .mtg-counter.good { color: #00ff88; }\n    #mtg-wrapper .mtg-counter.warn { color: #ffaa00; }\n    #mtg-wrapper .mtg-counter.bad { color: #ff4444; }\n    #mtg-wrapper .mtg-input, #mtg-wrapper .mtg-textarea { width: 100%; background: #12121a; border: 1px solid #333; border-radius: 8px; padding: 10px 14px; color: #fff; font-size: 14px; outline: none; transition: border-color 0.3s; }\n    #mtg-wrapper .mtg-input:focus, #mtg-wrapper .mtg-textarea:focus { border-color: #00f5ff; }\n    #mtg-wrapper .mtg-textarea { min-height: 80px; resize: vertical; }\n    #mtg-wrapper .mtg-checkbox-group { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 8px; }\n    #mtg-wrapper .mtg-checkbox-label { display: flex; align-items: center; gap: 6px; font-size: 13px; color: #ccc; cursor: pointer; }\n    #mtg-wrapper .mtg-checkbox { accent-color: #00f5ff; width: 16px; height: 16px; }\n    #mtg-wrapper .mtg-preview-tabs { display: flex; gap: 8px; margin-bottom: 16px; }\n    #mtg-wrapper .mtg-tab { padding: 8px 16px; background: #12121a; border: 1px solid #333; border-radius: 8px; color: #888; font-size: 13px; font-weight: 600; cursor: pointer; transition: all 0.2s; }\n    #mtg-wrapper .mtg-tab.active { background: linear-gradient(135deg, #00f5ff22, #b026ff22); border-color: #00f5ff; color: #00f5ff; }\n    #mtg-wrapper .mtg-preview-box { background: #fff; border-radius: 8px; padding: 16px; color: #000; min-height: 120px; }\n    #mtg-wrapper .mtg-preview-g-title { font-size: 20px; color: #1a0dab; font-family: arial, sans-serif; margin-bottom: 4px; line-height: 1.2; }\n    #mtg-wrapper .mtg-preview-g-url { font-size: 14px; color: #006621; margin-bottom: 4px; }\n    #mtg-wrapper .mtg-preview-g-desc { font-size: 14px; color: #545454; line-height: 1.4; }\n    #mtg-wrapper .mtg-preview-fb { background: #fff; border-radius: 8px; overflow: hidden; border: 1px solid #ddd; }\n    #mtg-wrapper .mtg-preview-fb-img { width: 100%; height: 150px; background: #eee; display: flex; align-items: center; justify-content: center; color: #888; background-size: cover; background-position: center; }\n    #mtg-wrapper .mtg-preview-fb-body { padding: 12px; }\n    #mtg-wrapper .mtg-preview-fb-url { font-size: 12px; color: #666; text-transform: uppercase; margin-bottom: 4px; }\n    #mtg-wrapper .mtg-preview-fb-title { font-size: 16px; font-weight: 600; color: #111; margin-bottom: 4px; }\n    #mtg-wrapper .mtg-preview-fb-desc { font-size: 14px; color: #666; }\n    #mtg-wrapper .mtg-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; justify-content: center; }\n    #mtg-wrapper .mtg-btn { padding: 10px 18px; border-radius: 8px; border: 1px solid #333; background: #12121a; color: #ccc; font-size: 14px; font-weight: 600; cursor: pointer; transition: all 0.2s; display: flex; align-items: center; gap: 6px; }\n    #mtg-wrapper .mtg-btn:hover { background: #1a1a2e; border-color: #00f5ff; color: #00f5ff; transform: translateY(-2px); }\n    #mtg-wrapper .mtg-btn-primary { background: linear-gradient(135deg, #00f5ff22, #b026ff22); border-color: #00f5ff55; color: #00f5ff; }\n    #mtg-wrapper .mtg-output { margin-top: 20px; background: #05050a; border: 1px solid #222; border-radius: 8px; padding: 16px; font-family: monospace; font-size: 13px; color: #00ff88; white-space: pre-wrap; word-break: break-all; max-height: 200px; overflow-y: auto; display: none; }\n    #mtg-wrapper .mtg-output.show { display: block; }\n    #mtg-wrapper .mtg-toast { position: fixed; bottom: 30px; left: 50%; transform: translateX(-50%) translateY(100px); background: #00f5ff; color: #000; padding: 12px 24px; border-radius: 8px; font-weight: 700; font-size: 14px; z-index: 9999; transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275); pointer-events: none; }\n    #mtg-wrapper .mtg-toast.show { transform: translateX(-50%) translateY(0); }\n  <\/style>\n<div class=\"mtg-content\">\n<div class=\"mtg-header\">\n<h2 class=\"mtg-title\">&#x1F680; Meta Tag Generator<\/h2>\n<p class=\"mtg-subtitle\">Generate SEO-optimized Meta Tags, Open Graph, and Twitter Cards with Live Previews<\/p>\n<\/p><\/div>\n<div class=\"mtg-grid\">\n<div class=\"mtg-panel\">\n<div class=\"mtg-panel-title\">&#x2699; Configuration<\/div>\n<div class=\"mtg-field\">\n<div class=\"mtg-label\"><span>Page Title<\/span><span class=\"mtg-counter good\" id=\"mtg-title-count\">0\/60<\/span><\/div>\n<p>          <input type=\"text\" class=\"mtg-input\" id=\"mtg-title\" placeholder=\"Enter SEO Title (Max 60 chars)\" maxlength=\"100\">\n        <\/div>\n<div class=\"mtg-field\">\n<div class=\"mtg-label\"><span>Meta Description<\/span><span class=\"mtg-counter good\" id=\"mtg-desc-count\">0\/160<\/span><\/div>\n<p>          <textarea class=\"mtg-textarea\" id=\"mtg-desc\" placeholder=\"Enter meta description (Max 160 chars)\" maxlength=\"300\"><\/textarea>\n        <\/div>\n<div class=\"mtg-field\">\n<div class=\"mtg-label\"><span>Keywords (comma separated)<\/span><\/div>\n<p>          <input type=\"text\" class=\"mtg-input\" id=\"mtg-keywords\" placeholder=\"keyword1, keyword2, keyword3\">\n        <\/div>\n<div class=\"mtg-field\">\n<div class=\"mtg-label\"><span>Author<\/span><\/div>\n<p>          <input type=\"text\" class=\"mtg-input\" id=\"mtg-author\" placeholder=\"Website Author Name\">\n        <\/div>\n<div class=\"mtg-field\">\n<div class=\"mtg-label\"><span>Robots Directives<\/span><\/div>\n<div class=\"mtg-checkbox-group\">\n            <label class=\"mtg-checkbox-label\"><input type=\"checkbox\" class=\"mtg-checkbox\" id=\"mtg-idx\" checked> Index<\/label><br \/>\n            <label class=\"mtg-checkbox-label\"><input type=\"checkbox\" class=\"mtg-checkbox\" id=\"mtg-fol\" checked> Follow<\/label><br \/>\n            <label class=\"mtg-checkbox-label\"><input type=\"checkbox\" class=\"mtg-checkbox\" id=\"mtg-arc\"> No Archive<\/label><br \/>\n            <label class=\"mtg-checkbox-label\"><input type=\"checkbox\" class=\"mtg-checkbox\" id=\"mtg-snp\"> No Snippet<\/label>\n          <\/div>\n<\/p><\/div>\n<div class=\"mtg-field\">\n<div class=\"mtg-label\"><span>OG Image URL<\/span><\/div>\n<p>          <input type=\"text\" class=\"mtg-input\" id=\"mtg-og-img\" placeholder=\"https:\/\/example.com\/image.jpg\">\n        <\/div>\n<\/p><\/div>\n<div class=\"mtg-panel\">\n<div class=\"mtg-panel-title\">&#x1F441; Live Previews<\/div>\n<div class=\"mtg-preview-tabs\">\n<div class=\"mtg-tab active\" data-tab=\"google\">Google<\/div>\n<div class=\"mtg-tab\" data-tab=\"facebook\">Facebook<\/div>\n<div class=\"mtg-tab\" data-tab=\"twitter\">Twitter<\/div>\n<\/p><\/div>\n<div id=\"mtg-prev-google\" class=\"mtg-preview-box\">\n<div class=\"mtg-preview-g-title\" id=\"mtg-p-g-title\">Your Page Title<\/div>\n<div class=\"mtg-preview-g-url\" id=\"mtg-p-g-url\">www.example.com<\/div>\n<div class=\"mtg-preview-g-desc\" id=\"mtg-p-g-desc\">Your meta description will appear here&#8230;<\/div>\n<\/p><\/div>\n<div id=\"mtg-prev-facebook\" class=\"mtg-preview-fb\" style=\"display:none;\">\n<div class=\"mtg-preview-fb-img\" id=\"mtg-p-fb-img\">OG Image Preview<\/div>\n<div class=\"mtg-preview-fb-body\">\n<div class=\"mtg-preview-fb-url\" id=\"mtg-p-fb-url\">EXAMPLE.COM<\/div>\n<div class=\"mtg-preview-fb-title\" id=\"mtg-p-fb-title\">Your OG Title<\/div>\n<div class=\"mtg-preview-fb-desc\" id=\"mtg-p-fb-desc\">Your OG description&#8230;<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<div id=\"mtg-prev-twitter\" class=\"mtg-preview-fb\" style=\"display:none;\">\n<div class=\"mtg-preview-fb-img\" id=\"mtg-p-tw-img\">Twitter Image Preview<\/div>\n<div class=\"mtg-preview-fb-body\">\n<div class=\"mtg-preview-fb-title\" id=\"mtg-p-tw-title\">Your Twitter Title<\/div>\n<div class=\"mtg-preview-fb-desc\" id=\"mtg-p-tw-desc\">Your Twitter description&#8230;<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<div class=\"mtg-actions\">\n      <button class=\"mtg-btn mtg-btn-primary\" id=\"mtg-generate\">&#x2728; Generate Code<\/button><br \/>\n      <button class=\"mtg-btn\" id=\"mtg-copy\">&#x1F4CB; Copy HTML<\/button><br \/>\n      <button class=\"mtg-btn\" id=\"mtg-download\">&#x1F4BE; Download<\/button><br \/>\n      <button class=\"mtg-btn\" id=\"mtg-reset\">&#x1F5D1; Reset<\/button>\n    <\/div>\n<div class=\"mtg-output\" id=\"mtg-output\"><\/div>\n<\/p><\/div>\n<div class=\"mtg-toast\" id=\"mtg-toast\">Copied!<\/div>\n<p>  <script>\n    (function() {\n      const $ = id => document.getElementById(id);\n      const title = $('mtg-title'), desc = $('mtg-desc'), keywords = $('mtg-keywords'), author = $('mtg-author'), ogImg = $('mtg-og-img');\n      const idx = $('mtg-idx'), fol = $('mtg-fol'), arc = $('mtg-arc'), snp = $('mtg-snp');\n      const output = $('mtg-output'), toast = $('mtg-toast');<\/p>\n<p>      function updateCounters() {\n        const tLen = title.value.length, dLen = desc.value.length;\n        const tCount = $('mtg-title-count'), dCount = $('mtg-desc-count');\n        tCount.textContent = `${tLen}\/60`; tCount.className = 'mtg-counter ' + (tLen <= 60 ? (tLen > 50 ? 'warn' : 'good') : 'bad');\n        dCount.textContent = `${dLen}\/160`; dCount.className = 'mtg-counter ' + (dLen <= 160 ? (dLen > 140 ? 'warn' : 'good') : 'bad');\n      }\n      function updatePreviews() {\n        const t = title.value || 'Your Page Title', d = desc.value || 'Your meta description will appear here...', img = ogImg.value || '';\n        $('mtg-p-g-title').textContent = t; $('mtg-p-g-desc').textContent = d;\n        $('mtg-p-fb-title').textContent = t; $('mtg-p-fb-desc').textContent = d;\n        $('mtg-p-fb-img').style.backgroundImage = img ? `url(${img})` : 'none'; $('mtg-p-fb-img').textContent = img ? '' : 'OG Image Preview';\n        $('mtg-p-tw-title').textContent = t; $('mtg-p-tw-desc').textContent = d;\n        $('mtg-p-tw-img').style.backgroundImage = img ? `url(${img})` : 'none'; $('mtg-p-tw-img').textContent = img ? '' : 'Twitter Image Preview';\n      }\n      function generateCode() {\n        let robots = [];\n        if (!idx.checked) robots.push('noindex'); else robots.push('index');\n        if (!fol.checked) robots.push('nofollow'); else robots.push('follow');\n        if (arc.checked) robots.push('noarchive'); if (snp.checked) robots.push('nosnippet');\n        const t = title.value, d = desc.value, k = keywords.value, a = author.value, img = ogImg.value;\n        let html = `<!-- Primary Meta Tags -->n<title>${t}<\/title>n<meta name=\"title\" content=\"${t}\">n<meta name=\"description\" content=\"${d}\">n`;\n        if (k) html += `<meta name=\"keywords\" content=\"${k}\">n`;\n        if (a) html += `<meta name=\"author\" content=\"${a}\">n`;\n        html += `<meta name=\"robots\" content=\"${robots.join(', ')}\">nn<!-- Open Graph \/ Facebook -->n<meta property=\"og:type\" content=\"website\">n<meta property=\"og:title\" content=\"${t}\">n<meta property=\"og:description\" content=\"${d}\">n`;\n        if (img) html += `<meta property=\"og:image\" content=\"${img}\">n`;\n        html += `n<!-- Twitter -->n<meta property=\"twitter:card\" content=\"summary_large_image\">n<meta property=\"twitter:title\" content=\"${t}\">n<meta property=\"twitter:description\" content=\"${d}\">n`;\n        if (img) html += `<meta property=\"twitter:image\" content=\"${img}\">n`;\n        output.textContent = html; output.classList.add('show');\n      }\n      function showToast(msg) { toast.textContent = msg; toast.classList.add('show'); setTimeout(() => toast.classList.remove('show'), 2000); }\n      function copyText(text) { navigator.clipboard.writeText(text).then(() => showToast('Copied! u{2705}')).catch(() => { const ta = document.createElement('textarea'); ta.value = text; document.body.appendChild(ta); ta.select(); document.execCommand('copy'); document.body.removeChild(ta); showToast('Copied! u{2705}'); }); }<\/p>\n<p>      [title, desc, keywords, author, ogImg].forEach(el => el.addEventListener('input', () => { updateCounters(); updatePreviews(); }));\n      [idx, fol, arc, snp].forEach(el => el.addEventListener('change', generateCode));\n      document.querySelectorAll('.mtg-tab').forEach(tab => {\n        tab.addEventListener('click', () => {\n          document.querySelectorAll('.mtg-tab').forEach(t => t.classList.remove('active')); tab.classList.add('active');\n          $('mtg-prev-google').style.display = tab.dataset.tab === 'google' ? 'block' : 'none';\n          $('mtg-prev-facebook').style.display = tab.dataset.tab === 'facebook' ? 'block' : 'none';\n          $('mtg-prev-twitter').style.display = tab.dataset.tab === 'twitter' ? 'block' : 'none';\n        });\n      });\n      $('mtg-generate').addEventListener('click', generateCode);\n      $('mtg-copy').addEventListener('click', () => { if(!output.textContent) generateCode(); copyText(output.textContent); });\n      $('mtg-download').addEventListener('click', () => { if(!output.textContent) generateCode(); const blob = new Blob([output.textContent], { type: 'text\/html' }); const a = document.createElement('a'); a.href = URL.createObjectURL(blob); a.download = 'meta-tags.html'; a.click(); });\n      $('mtg-reset').addEventListener('click', () => { [title, desc, keywords, author, ogImg].forEach(el => el.value = ''); idx.checked = fol.checked = true; arc.checked = snp.checked = false; updateCounters(); updatePreviews(); output.textContent = ''; output.classList.remove('show'); });\n      updateCounters(); updatePreviews();\n    })();\n  <\/script>\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Generate SEO-optimized Meta Tags, Open Graph, and Twitter Cards with Live Previews.<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-47","page","type-page","status-publish"],"_links":{"self":[{"href":"https:\/\/toolskit.site\/index.php\/wp-json\/wp\/v2\/pages\/47","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/toolskit.site\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/toolskit.site\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/toolskit.site\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/toolskit.site\/index.php\/wp-json\/wp\/v2\/comments?post=47"}],"version-history":[{"count":0,"href":"https:\/\/toolskit.site\/index.php\/wp-json\/wp\/v2\/pages\/47\/revisions"}],"wp:attachment":[{"href":"https:\/\/toolskit.site\/index.php\/wp-json\/wp\/v2\/media?parent=47"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}