Personalise Your Chrome Browser Experience with Scripts

[makerhacks]

Ever wanted to hide or highlight things on web pages that you do not own? Well - You can!

Here is how I stopped seeing particular spammers entirely and you can too!

(See previous post for more info about that)

User Scripts

For a long time I was using a heck of a lot of browser extensions, until I discovered an extension that allowed you to run your own JavaScript or apply CSS to transform the content you saw (or didn't want to see).

Unfortunately Chrome dropped the hammer on the extension I was using, and so I had to make my own browser extension for my YouTube watch later housekeeping. It's a bit of a pain to have to do that.

As an alternative, you can switch to using Brave browser, but I make significant use of Chrome profiles so I am not quite sure if I want to move over.

Fortunately a new, rules-compliant extension has shown up! Following the naming convention for these things (greasemonkey, violentmonkey, tampermonkey, etc), this one is "wild monkey":

GitHub - muzuiget/monkey-support: Lightweight userscript manager

It's not the only one out there that can do this, not even the one with the most/best reviews, but it is the one that I found works for me.

Customisations

Two types of customisation are supported:

• CSS CSS stylesheets.

• JavaScript Execute JavaScript code.

When None is selected, the code will not be executed, equivalent to setting it as draft or disabled.

Make the Code Execute Automatically

By default you have to tell the extension that you want to run your script, but you can make it run automatically when the site you visit matches a domain or wildcard URL.

The format uses * to represent zero or more characters, and one pattern per line, for example:

https://example.com/*

If no pattern is matched then a button is displayed in the extension.

Examples

Not to pick on Hackaday because actually they are really not bad at all, here's how you can hide annoying or intrusive ads on a site:

// ==UserScript==
// @name         Hide Sponsored 
// @namespace    https://chrisg.com/
// @version      1.2
// @description  Hide feed items labelled "Sponsored"
// @match        https://*.hackaday.com/*
// @run-at       document_idle
// ==/UserScript==

(function() {
  
    document.getElementsByClassName('ads-one')[0].remove();
    document.getElementsByClassName('ads-two')[0].remove()
    var spans = document.getElementsByTagName('span');
    var sponsored;
    for (let entry of spans) { 
        if(entry.innerHTML=='Sponsored') sponsored=entry;  
    }
    sponsored.parentNode.style.display='none';
})();

There will be sites where the site policy is so strict even extensions can't mess with the JavaScript code, throwing a "[Violation] Permissions policy violation" error.

Unfortunately I have not found a solution to that.

Comments

[bozz]

The whole manifest v3 thing has been wrecking havoc with a lot of the stuff we use in the school system through our Google workspace implementation.

[makerhacks]

It really should have been optional

[bozz]

I agree!

[stemsocial]

Thanks for your contribution to the STEMsocial community. Feel free to join us on discord to get to know the rest of us!

Please consider delegating to the @stemsocial account (85% of the curation rewards are returned).

Consider setting @stemsocial as a beneficiary of this post's rewards if you would like to support the community and contribute to its mission of promoting science and education on Hive.