SEO Search Snippet Simulator
Optimize your titles and meta descriptions for better CTR.
0 / 160 chars
G
Example Website
https://example.com › snippet › preview
Your Page Title Will Appear Here
Provide a meta description to see how your snippet might look in Google's search results. An optimal length is between 120 and 160 characters.
function updatePreview() {
var title = document.getElementById('input-title').value;
var desc = document.getElementById('input-desc').value;
var previewTitle = document.getElementById('preview-title');
var previewDesc = document.getElementById('preview-desc');
var titleCharCount = document.getElementById('title-char-count');
var descCharCount = document.getElementById('desc-char-count');
var titleBar = document.getElementById('title-bar');
var descBar = document.getElementById('desc-bar');
// Update Text
previewTitle.innerText = title || "Your Page Title Will Appear Here";
previewDesc.innerText = desc || "Provide a meta description to see how your snippet might look in Google's search results. An optimal length is between 120 and 160 characters.";
// Counters
var tLen = title.length;
var dLen = desc.length;
titleCharCount.innerText = tLen;
descCharCount.innerText = dLen;
// Title Bar Logic (Limit 60)
var tPercent = (tLen / 60) * 100;
titleBar.style.width = Math.min(tPercent, 100) + '%';
titleBar.style.background = (tLen > 60) ? '#ea4335' : (tLen > 50) ? '#34a853' : '#fbbc05';
// Desc Bar Logic (Limit 160)
var dPercent = (dLen / 160) * 100;
descBar.style.width = Math.min(dPercent, 100) + '%';
descBar.style.background = (dLen > 160) ? '#ea4335' : (dLen > 120) ? '#34a853' : '#fbbc05';
}
function clearFields() {
document.getElementById('input-title').value = ";
document.getElementById('input-desc').value = ";
updatePreview();
}
function copyMeta() {
var title = document.getElementById('input-title').value;
var desc = document.getElementById('input-desc').value;
var text = "Title: " + title + "\nDescription: " + desc;
var dummy = document.createElement("textarea");
document.body.appendChild(dummy);
dummy.value = text;
dummy.select();
document.execCommand("copy");
document.body.removeChild(dummy);
alert("Copied to clipboard!");
}