Create Your Own SEO Browser Extension

As digital marketers, we often rely heavily on browser extensions to help us with everything from keyword analysis to meta data tracking. These tools provide invaluable insights and significantly streamline our daily tasks, becoming vital components in our digital toolkits.

However, it’s important to be mindful that this convenience doesn’t come without potential downsides. Any plugin, despite their benefits, can pose a security risk, as they often require access to sensitive data and can be vulnerable to hacking.

And as anyone who uses a lot of extensions will know, they can often cause your browser to malfunction or behave in strange ways. Pinpointing the problematic extension amidst a sea of plugins is often a tedious and time-consuming task, causing even more disruption to our workflow.

But what if you could make your SEO tasks even easier by creating your own browser extension? It may sound daunting, especially if you’re not technically inclined, but with the help of bookmarklets and AI, anyone can do it!

What Is A Bookmarklet?

A bookmarklet is a small piece of JavaScript code that can be saved as a bookmark in your browser. When clicked, it performs a specific function such as displaying metadata or checking a webpage’s loading speed – essentially, it’s a mini browser extension!

So, how can you create your own SEO bookmarklet, especially if you’re not fluent in JavaScript? Here’s where ChatGPT comes into play. Even if you’ve never written a line of JavaScript, ChatGPT can guide you through the process.

Step 1: Choose A Function

Before diving into code, the first step is to clearly decide what you want your tool to do. Think of the tasks you perform most frequently, or the data you often need to access – could this process be streamlined?

You could create a bookmarklet that displays the meta data of a webpage, or perhaps you want it to check for broken links. The possibilities are vast and can be tailored to your specific SEO needs.

Step 2: ChatGPT to the Rescue

Don’t worry if the JavaScript code looks confusing – this is about as technical as CTRL-C, CTRL-V!

In ChatGPT, describe in plain English what you want your tool to do. For instance, if you say, “Write the javascript for a bookmarklet tool that displays the structured data of the webpage” ChatGPT will generate something like the following:

javascript:(function()
    var structuredDataTypes = [‘application/ld+json’, ‘application/microdata+json’, ‘application/rdf+xml’];
    var structuredDataElements = Array.prototype.slice.call(document.querySelectorAll(‘script,link’));
    structuredDataElements = structuredDataElements.filter(function(element) {
        var type = element.getAttribute(‘type’) || element.getAttribute(‘datatype’);
        return structuredDataTypes.indexOf(type) !== -1;
    });


    var structuredData = structuredDataElements.map(function(element) {
        return JSON.parse(element.innerText);
    });


    var newWindow = window.open(“”, “_blank”);
    newWindow.document.write(‘<pre>’ + JSON.stringify(structuredData, null, 2) + ‘</pre>’);
})();

{

Step 3: Create Your Bookmarklet

Once you have your JavaScript code, creating the bookmarklet is straightforward:

1. Open your browser and go to the bookmarks bar.
2. Right-click on the bookmarks bar and select “Add page” or “Add new bookmark.”
3. Give your bookmarklet a name, like “Check Schema”
4. In the URL field, paste your JavaScript code and click “Save” or “Add.”

Now, you have your own custom SEO bookmarklet! Just click on it while you’re on any webpage, and it will perform the function.

Streamline Your SEO

The beauty of creating your own bookmarklets is that you can tailor them to your specific needs. And with the power of AI and ChatGPT, the process becomes accessible to everyone, not just those with technical expertise.

Create different bookmarklets for your team, share them, and streamline your SEO processes. From displaying alt text of images to checking if a webpage is indexed (possible by automating a ‘site:’ search in Google!), the possibilities are endless!

So, get your creative gears spinning, and remember – you’re not alone in this journey. ChatGPT is here to lend a helping hand (or line of code) whenever you need it!

Back to blog list