How to edit a website's background colors

Question

I have zero coding experience but a website I use has way too bright colors in some of its "boxes".

I would like to create a plugin so that myself and anoth

Answer 1

Sounds like you just found a textbook example of why the extensions TamperMonkey (recent) and GreaseMonkey (outdated) were invented.

Building an extension is quite involved: you need to create a manifest, there are separate files for content scripts and background pages - all around it's a bit complicated. And it's a shifting tapestry of change.

But all is not lost - TamperMonkey to the rescue.

1. Install the TamperMonkey extension for your browser of choice

2. On the target website, click the TamperMonkey icon

3. Either click "Add a new script" or (if that does not display) click "Dashboard" and then, when that opens, click the [+] tab. A new blank script template will open. Modify it as follows:

// ==UserScript==
// @name         Name That Will Show In The List of Scripts (in TM Dashboard)
// @namespace    http://tampermonkey.net/
// @match        *://name_of_desired_domain.com/*
// @require      http://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js
// @grant        none
// ==/UserScript==

(function() {
    'use strict';
    //your code goes here. For example:
    let mycss = '';
    $(body).append(mycss);
});

Notes:

1. The @name line is YOUR name for your script. It can be anything - anything at all. When the day comes that you have several TamperMonkey scripts written for several websites (I currently have over 200), this is the name that displays in the TamperMonkey dashboard, like a "filename" for a Excel spreadsheet.

2. The @match line will be initially populated with the exact url for the page you are on. Usually, this is not quite what you want. For example, suppose you are on the website http://example.com/blog/name-of-a-particular-blog-post - usually, you will want this same script to run on every blog post, not just this one. Simply replace the too-specific part with a *, like this: http://example.com/blog/* and it will now run on any page with a url that begins with those characters.

3. The @require line allows you to use jQuery in your script. If you don't need jQuery, you don't need this line. Leave it out.

4. When a TamperMonkey script is active on a webpage, the TamperMonkey extension icon displays a red block

What Can TamperMonkey Do For Me?

What sorts of things can you do with TamperMonkey? You can completely reformat the page! There are pages where I save all the

tags (with their contents) into a variable, and then do this: $('body').html(myvar); - whatever used to be on the page is now replaced with nothing but these paragraphs of content. Goodbye, clutter! You can inject new