What is an SEO bookmarklet?
A bookmarklet is essentially a small piece of JavaScript code that is saved in place of the "URL" field of a normal Chrome bookmark. But when you click the "bookmarklet" it runs the JavaScript code to do whatever it was created to do.
Although Bookmarklets can be created and used for almost any industry or to automate any task, an SEO bookmarklet is used to help speed up tasks that SEOs do daily or to replace existing SEO tools or SEO extensions.
SEO bookmarklets are incredible useful before you can fully customize them to do what you need it to do, some examples include highlighting links or heading tags on a page. view schema or hreflang or open the webpage in a specific SEO tool.
I have customized a series of SEO bookmarklets that I use for SEO daily and am constantly adding to the list.
Table of Contents
How to create a bookmarklet for SEO:
Creating an SEO bookmarklet can be as easy as you need it to be. If you already know JavaScript then you can dive write in and create your own code. If you are a Javascript beginner (like me) then you can create them easily using an AI tool like ChatGPT, Microsoft Copilot or HuggingChat.
AI chatbots or Copilots can create an SEO bookmarklet based on your needs from a pretty basic prompt. Then always test and modify it as needed.
How to save an SEO bookmarklet in Chrome:
Open the bookmark manager
Click the 3 dots in the top right to add new bookmark
Paste the JavaScript in the "URL" field and name it whatever you want that's it!
Now just click on it just like you would any other bookmark
15 Best SEO Bookmarklets for Google Chrome
1. Highlight no follow links
This will highlight all of the "nofollow" links on the current web page
javascript:(function() { var links = document.getElementsByTagName('a'); for (var i = 0; i < links.length; i++) { if (links[i].rel.includes('nofollow')) { links[i].style.backgroundColor = 'yellow'; } } })();
2. Highlight and label htags
This will highlight all of the h tags (subheaders) on the current web page and label them so you can know which h tag is assigned to which text
javascript:(function()%7Bconst headers%3Ddocument.querySelectorAll('h1%2C h2%2C h3%2C h4%2C h5%2C h6')%3Bheaders.forEach(header%3D>%7Bheader.style.backgroundColor%3D'yellow'%3Bheader.style.border%3D'1px solid red'%3Bconst label%3Ddocument.createElement('span')%3Blabel.style.backgroundColor%3D'red'%3Blabel.style.color%3D'white'%3Blabel.style.padding%3D'2px 4px'%3Blabel.style.marginLeft%3D'10px'%3Blabel.style.fontSize%3D'12px'%3Blabel.textContent%3Dheader.tagName.toLowerCase()%3Bheader.appendChild(label)%3B%7D)%7D)()
3. Extract h tags to new tab
This will extract all of the h tags (subheaders) on the current web page to a new tab
javascript:(function() { var hTags = document.querySelectorAll("h1, h2, h3, h4, h5, h6"); var div = document.createElement("div"); div.innerHTML = ""; for (var i = 0; i < hTags.length; i++) { var hTag = hTags[i]; var text = hTag.textContent; var level = hTag.tagName.charAt(1) - 1; var span = document.createElement("span"); span.innerHTML = text; span.style.paddingLeft = level * 20 + "px"; div.appendChild(span); div.innerHTML += "<br>"; } var newTab = window.open("about:blank"); newTab.document.body.appendChild(div);})()
4. Show image alt text and dimensions
This will show all of the image alt text on the current web page
javascript:(function(){ var images = document.querySelectorAll("img"); for (var i = 0; i < images.length; i++) { var image = images[i]; var altText = image.getAttribute("alt"); var dimensions = image.naturalWidth + "x" + image.naturalHeight; var div = document.createElement("div"); div.textContent = altText + " | " + dimensions; div.style.backgroundColor = "lightgreen"; image.parentNode.insertBefore(div, image.nextSibling); }})()
5. Show schema on the page
This will show all of the schema on the current web page in a pop up
javascript:(function() { var structuredData = document.querySelectorAll('script[type="application/ld+json"]'); if (structuredData.length === 0) { alert("No structured data (JSON-LD) found on this page."); return; } var jsonData = []; structuredData.forEach(function(script) { try { var data = JSON.parse(script.textContent); jsonData.push(data); } catch (error) { console.error("Error parsing JSON-LD:", error); } }); if (jsonData.length === 0) { alert("No valid structured data (JSON-LD) found on this page."); return; } var info = JSON.stringify(jsonData, null, 2); var modal = document.createElement('div'); modal.style.position = 'fixed'; modal.style.top = '50%'; modal.style.left = '50%'; modal.style.transform = 'translate(-50%, -50%)'; modal.style.padding = '20px'; modal.style.background = 'white'; modal.style.border = '2px solid #ccc'; modal.style.zIndex = '9999'; modal.style.width = '80%'; modal.style.height = '80%'; var textArea = document.createElement("textarea"); textArea.value = info; textArea.style.width = '100%'; textArea.style.height = '90%'; textArea.style.resize = 'none'; modal.appendChild(textArea); var copyButton = document.createElement("button"); copyButton.textContent = "Copy"; copyButton.style.marginTop = '10px'; copyButton.style.padding = '5px 10px'; copyButton.style.background = '#007bff'; copyButton.style.color = '#fff'; copyButton.style.border = 'none'; copyButton.style.cursor = 'pointer'; copyButton.onclick = function() { textArea.select(); document.execCommand("copy"); alert("Copied to clipboard!"); }; modal.appendChild(copyButton); var closeButton = document.createElement("button"); closeButton.textContent = "Close"; closeButton.style.marginTop = '10px'; closeButton.style.padding = '5px 10px'; closeButton.style.background = '#007bff'; closeButton.style.color = '#fff'; closeButton.style.border = 'none'; closeButton.style.cursor = 'pointer'; closeButton.onclick = function() { document.body.removeChild(modal); }; modal.appendChild(closeButton); document.body.appendChild(modal); })();
6. Show basic main meta data
This will show the basic meta data (meta title, meta description, canonical) on the current web page in a pop up
javascript:(function() { var title = document.title; var description = document.querySelector('meta[name="description"]'); var canonical = document.querySelector('link[rel="canonical"]'); var noindex = document.querySelector('meta[name="robots"][content*="noindex"]'); var info = "Meta Title: " + title + "\n"; if(description) info += "Meta Description: " + description.content + "\n"; else info += "Meta Description: Not found\n"; if(canonical) info += "Canonical URL: " + canonical.href + "\n"; else info += "Canonical URL: Not found\n"; if(noindex) info += "Noindex Tag: Found"; else info += "Noindex Tag: Not found"; var modal = document.createElement('div'); modal.style.position = 'fixed'; modal.style.top = '50%'; modal.style.left = '50%'; modal.style.transform = 'translate(-50%, -50%)'; modal.style.padding = '20px'; modal.style.background = 'white'; modal.style.border = '2px solid #ccc'; modal.style.zIndex = '9999'; modal.style.width = '600px'; modal.style.height = '500px'; var textArea = document.createElement("textarea"); textArea.value = info; textArea.style.width = '100%'; textArea.style.height = '70%'; textArea.style.resize = 'none'; modal.appendChild(textArea); var copyButton = document.createElement("button"); copyButton.textContent = "Copy"; copyButton.style.marginTop = '10px'; copyButton.style.padding = '5px 10px'; copyButton.style.background = '#007bff'; copyButton.style.color = '#fff'; copyButton.style.border = 'none'; copyButton.style.cursor = 'pointer'; copyButton.onclick = function() { textArea.select(); document.execCommand("copy"); alert("Copied to clipboard!"); }; modal.appendChild(copyButton); var closeButton = document.createElement("button"); closeButton.textContent = "Close"; closeButton.style.marginTop = '10px'; closeButton.style.padding = '5px 10px'; closeButton.style.background = '#007bff'; closeButton.style.color = '#fff'; closeButton.style.border = 'none'; closeButton.style.cursor = 'pointer'; closeButton.onclick = function() { document.body.removeChild(modal); }; modal.appendChild(closeButton); document.body.appendChild(modal);})();
7. Show all hreflang
This will show the hreflang tags on the current web page in a pop up
javascript:(function() { var hreflangs = document.querySelectorAll('link[rel="alternate"][hreflang]'); if (hreflangs.length === 0) { alert("No hreflang tags found on this page."); return; } var info = "Hreflang Languages and URLs:\n\n"; hreflangs.forEach(function(hreflang) { var language = hreflang.getAttribute("hreflang"); var url = hreflang.getAttribute("href"); info += language + ": " + url + "\n"; }); var modal = document.createElement('div'); modal.style.position = 'fixed'; modal.style.top = '50%'; modal.style.left = '50%'; modal.style.transform = 'translate(-50%, -50%)'; modal.style.padding = '20px'; modal.style.background = 'white'; modal.style.border = '2px solid #ccc'; modal.style.zIndex = '9999'; modal.style.width = '500px'; modal.style.height = '400px'; var textArea = document.createElement("textarea"); textArea.value = info; textArea.style.width = '100%'; textArea.style.height = '70%'; textArea.style.resize = 'none'; modal.appendChild(textArea); var copyButton = document.createElement("button"); copyButton.textContent = "Copy"; copyButton.style.marginTop = '10px'; copyButton.style.padding = '5px 10px'; copyButton.style.background = '#007bff'; copyButton.style.color = '#fff'; copyButton.style.border = 'none'; copyButton.style.cursor = 'pointer'; copyButton.onclick = function() { textArea.select(); document.execCommand("copy"); alert("Copied to clipboard!"); }; modal.appendChild(copyButton); var closeButton = document.createElement("button"); closeButton.textContent = "Close"; closeButton.style.marginTop = '10px'; closeButton.style.padding = '5px 10px'; closeButton.style.background = '#007bff'; closeButton.style.color = '#fff'; closeButton.style.border = 'none'; closeButton.style.cursor = 'pointer'; closeButton.onclick = function() { document.body.removeChild(modal); }; modal.appendChild(closeButton); document.body.appendChild(modal);})();
8. Open page in GSC
This will show the current page (of your verified websites) in Google Search Console
javascript:void(window.open(%27https://search.google.com%2Fsearch-console%2Fperformance%2Fsearch-analytics?resource_id=%27+window.location.protocol+%27%2F%2F%27+window.location.hostname+%27%2F&num_of_days=28&breakdown=query&page=!%27+window.location.href+%27&metrics=CLICKS%2CIMPRESSIONS%2CCTR%2CPOSITION&country=us%27,%27_blank%27));
9. Open page in SEMrush
This will show the current page in SEMrush
javascript:(function() { var currentUrl = encodeURIComponent(window.location.href); var semrushUrl = 'https://www.semrush.com/analytics/overview/?q=%27%20+%20currentUrl;%20%20%20%20window.open(semrushUrl,%20%27_blank%27);})();
10. Open page in page speed insights
This will show the current page in in page speed insights
javascript:(function() { var url = 'https://developers.google.com/speed/pagespeed/insights/?url=' + encodeURIComponent(window.location.href); window.open(url, '_blank'); })();
11. Validate Schema
This will show the current page in the Schema Validator
javascript:(function(){window.open('https://validator.schema.org/?url=' + encodeURIComponent(window.location.href));})();
12. Extract links and anchors
This will extract the ahref URLs and anchor text from the body of the current web page and display it in a table in a popup window
javascript:(function() { var links = document.querySelectorAll('a'); var result = '<table border="1"><tr><th>Anchor Text</th><th>URL</th></tr>'; for (var i = 0; i < links.length; i++) { var anchorText = links[i].textContent.trim() || links[i].innerText.trim(); var href = links[i].href; if (href) { result += '<tr><td>' + anchorText + '</td><td>' + href + '</td></tr>'; } } result += '</table>'; var newWindow = window.open('', '', 'width=600,height=400'); newWindow.document.write(result); newWindow.document.close();})();
13. Show all Google Analytics Tracking Codes
Use this SEO bookmarklet to show all of the Google Analytics UA, GTM and GA4 tracking codes on a webpage
javascript:!function(){let e=function e(){let t=document.getElementsByTagName("script"),n=[];for(let l of t){if(l.src){let a=l.src.match(/(UA-\d{4,9}-\d{1,4}|G-[A-Za-z0-9]+|GTM-[A-Za-z0-9]+)/);a&&n.push(a[0])}if(l.innerHTML){let i=l.innerHTML.match(/UA-\d{4,9}-\d{1,4}/),o=l.innerHTML.match(/G-[A-Za-z0-9]+/),s=l.innerHTML.match(/GTM-[A-Za-z0-9]+/);i&&n.push(i[0]),o&&n.push(o[0]),s&&n.push(s[0])}}return n}();if(e.length>0){var t;let n,l,a,i,o;t=e,(n=document.createElement("div")).style.position="fixed",n.style.top="10%",n.style.left="50%",n.style.transform="translateX(-50%)",n.style.padding="20px",n.style.backgroundColor="white",n.style.border="1px solid #ccc",n.style.boxShadow="0 2px 10px rgba(0,0,0,0.1)",n.style.zIndex="10000",n.style.maxWidth="600px",n.style.wordBreak="break-word",(l=document.createElement("h2")).innerText="Google Analytics & GTM Tags",l.style.margin="0 0 10px 0",l.style.fontSize="18px",l.style.fontFamily="Arial, sans-serif",n.appendChild(l),(a=document.createElement("textarea")).style.width="100%",a.style.height="400px",a.style.marginBottom="10px",a.value=t.join("\n"),n.appendChild(a),(i=document.createElement("button")).innerText="Copy",i.style.marginRight="10px",i.onclick=function(){a.select(),document.execCommand("copy")},n.appendChild(i),(o=document.createElement("button")).innerText="Close",o.onclick=function(){document.body.removeChild(n)},n.appendChild(o),document.body.appendChild(n)}else alert("No Google Analytics or GTM tags found.")}();
14. Highlight all links (with no follow a different color)
Unlike the first SEO bookmarklet that only highlights nofollow links, this one will highlight every href link on the page and the nofollow links will be a different color
javascript:(function()%7Bconst links%3Ddocument.querySelectorAll('a')%3Blinks.forEach(link%3D>%7Bif(link.getAttribute('rel')%3D%3D'nofollow')%7Blink.style.backgroundColor%3D'lightred'%3Blink.style.border%3D'2px solid darkred'%3B%7Delse%7Blink.style.backgroundColor%3D'lightgreen'%3Blink.style.border%3D'2px solid darkgreen'%3B%7D%7D)%7D)()
15. Classify images as lazy loaded or not lazy loaded
When this script is ran it will show a popup identifying each image on the page, in order, as lazy loaded, not lazy loaded or eager loaded.
javascript:(function() { let arr = []; let images = document.querySelectorAll('img'); for(let i = 0; i < images.length; i++) { if(images[i].loading === "lazy") { arr.push(images[i].src + " is lazy loaded"); } else if(images[i].loading === "eager") { arr.push(images[i].src + " is eager loaded"); } else { arr.push(images[i].src + " is not lazy or eager loaded"); } } function copyToClipboard(text) { const textArea = document.createElement('textarea'); textArea.value = text; document.body.appendChild(textArea); textArea.select(); document.execCommand('copy'); document.body.removeChild(textArea); } function main() { const container = document.createElement('div'); container.style.position = 'fixed'; container.style.top = '10px'; container.style.right = '10px'; container.style.backgroundColor = 'white'; container.style.border = '1px solid black'; container.style.padding = '10px'; container.style.maxHeight = '90vh'; container.style.overflowY = 'auto'; container.style.zIndex = '999999'; container.style.fontFamily = 'Arial, sans-serif'; container.style.width = '300px'; arr.forEach(el => { let content = document.createElement('p'); content.textContent = el; container.appendChild(content); }); const copyButton = document.createElement('button'); copyButton.textContent = 'Copy to Clipboard'; copyButton.style.marginTop = '10px'; copyButton.onclick = function() { copyToClipboard(arr.join('\n')); alert('Copied to clipboard!'); }; container.appendChild(copyButton); const closeButton = document.createElement('button'); closeButton.textContent = 'Close'; closeButton.style.marginTop = '10px'; closeButton.onclick = function() { document.body.removeChild(container); }; container.appendChild(closeButton); document.body.appendChild(container); } main();})();
About the Author: Kyle Place E-E-A-Ts, Sleeps and Breathes SEO. You can find him doing SEO, talking about SEO or learning about SEO.
Comments