Hacker Newsnew | past | comments | ask | show | jobs | submitlogin

Write a Grease-monkey (or equivalent) script, that reads your query variable, applies the value to the top bar, and then add that parameter to all links on the page.

Optional: Then write a bookmarklet, that displays a color-picker, and reloads the tab with the changed querystring variable.

(HN web server admin might get some "scary" log file entries though, regarding an "unusual" additional QS variable)



That’s called CSS. Use a user style, not javascript. The query is not applicable since its not offered by HN themselves.


You are misunderstanding what grease-monkey can do, and what I'm proposing.

e.g. try loading news.ycombinator.com?myColorVar=44ff55 , it will load normally, as usual. Of course, this variable means nothing to the HN backend, but this is where e.g. Grease-monkey comes in: It injects a bit of javascript of your choosing into the page context for the news.ycombinator.com/* pages. This scriplet can easily change the color of the header-bar, and add the colorVariable to all (non-external) links.

Of course, you can add a line like the following to your local userContent.css:

@-moz-document domain(news.ycombinator.com) { #hnmain>tbody>tr:first-of-type>td { background-color: lime !important; }

, but this has the disadvantage of requiring a Firefox restart for each change, whereas my method requires only twiddling the value in the URL, and it's valid for all future requests, until you change it again.

I hope, the above makes it clearer, what I meant the post above


The following code snippet in a grease-monkey-script with

// @include https://news.ycombinator.com/*

in the header will color the top-bar on HN pages with the color given in the URL such like https://news.ycombinator.com#MYC=lime or https://news.ycombinator.com#MYC=#ce1c01 .

(function() { if (color=document.location.href.match(/#MYC=(.)/)[1]) { document.querySelector("#hnmain>tbody>tr:first-of-type>td").setAttribute("bgcolor",color); document.querySelectorAll('a[href^="https://news.ycomb"],a:not([href="/"])') .forEach(e => {e.href+="#MYC="+color}); } })();

This script colors the top bar, and adds the custom colour to all HN-internal links, so until you manually change the URL, further navigation in that tab within news.ycombinator.com will retain your chosen top-bar colour.

(I hope the code comes out formatted in a legible way)


You’re missing the point of the query. What’s the point of using the query at all?

OP suggested it as a way for users to customize their HN color; Then you suggested to take this query and make an extension out of it.

If you want to customize your HN color, use CSS, not this roundabout way through a query parameter.

The query never makes sense anyway. If HN were to allow customization they’d allow it in the options, not as a random query that you have to set manually.




Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: