An acquaintance has been asked to work long hours using a painfully basic form-based website. It’s a site that won’t let you change the CSS with Stylish — because the site has no CSS. The site is so database-centric that the techies who coded it didn’t even think of styling it. The employers refuse to change anything, presumably for fear of something breaking in a costly manner.
In such a case, it is still possible to configure the way the site looks — and without resorting to “the nuclear option” of changing your browser Options so as to affect all websites. The Boring CSS script for Firefox’s GreaseMonkey addon works well. It lets you change the display style for just one website. It does this by injecting the needed CSS styles, even if no CSS reference exists exists in the original page, into the source code after the page hits the web browser.
To use: install, right-click on your browser’s lower-right Monkey icon, choose “Manage user scripts”, choose “Boring CSS” and “Edit”. You may be asked what text editor you’d like to use. If so, point to C:/Windows/Notepad.exe. The boring_css.user.js file will open, ready for editing. Remove all but one of the pre-set website addresses in the script, and then add just the one you want to target. The lines below “mystylesheet” are the ones to edit, and these change the look of the website. You might not want to do more than change the font name, font size and the background colour of the page, but you can do more if you know how CSS works. Save, then reload the page to view any changes.
This is the bit of the script which changes how the page looks…
mystylesheet = '' +
'body {font-family: Georgia, Verdana, sans-serif; color: black; background: #EEEEEE;}' +
'h1 {font: 16pt Georgia, serif;}' +
'h2 {font-size: 12pt;}' +
'h3 {font-size: 11pt;}' +
'h4 {font-size: 10pt;}' +
'a:link {color: #00A;}' +
'a:visited {color: #666;}' +
'a:hover {color: #008; background: #EEF;}' +
'a, div, p, dd, li {font-size: 10pt; line-height: 170%;}'
