SEO Snippet Optimizer
SERP Preview
function updateSerpPreview() {
var title = document.getElementById('seo-title-input').value;
var desc = document.getElementById('seo-desc-input').value;
var titleDisplay = document.getElementById('serp-title-display');
var descDisplay = document.getElementById('serp-desc-display');
var titleCount = document.getElementById('title-count');
var descCount = document.getElementById('desc-count');
var titleBar = document.getElementById('title-bar-fill');
var descBar = document.getElementById('desc-bar-fill');
// Title Logic
titleDisplay.innerText = title || "Example Page Title";
titleCount.innerText = title.length + " / 60″;
var titlePct = Math.min((title.length / 60) * 100, 100);
titleBar.style.width = titlePct + "%";
titleBar.style.background = (title.length > 60) ? "#ef4444" : "#22c55e";
// Description Logic
descDisplay.innerText = desc || "Please enter a meta description to see how your site will appear in Google search results.";
descCount.innerText = desc.length + " / 160″;
var descPct = Math.min((desc.length / 160) * 100, 100);
descBar.style.width = descPct + "%";
descBar.style.background = (desc.length > 160) ? "#ef4444" : "#22c55e";
}
function copySnippetData() {
var title = document.getElementById('seo-title-input').value;
var desc = document.getElementById('seo-desc-input').value;
var text = "Title: " + title + "\nDescription: " + desc;
var tempInput = document.createElement("textarea");
tempInput.value = text;
document.body.appendChild(tempInput);
tempInput.select();
document.execCommand("copy");
document.body.removeChild(tempInput);
alert("SEO metadata copied to clipboard!");
}
example.com › …
Example Page Title
Please enter a meta description to see how your site will appear in Google search results.