Clear questions and runnable code
get the best and fastest answer
We Stylin'!by Petruchio (Vicar)
|on Feb 12, 2002 at 18:09 UTC||Need Help??|
I am pleased to announce that PerlMonks now features Cascading StyleSheet support. You can supply either the URL of an offsite stylesheet, or supply CSS markup directly to be stored here onsite. Please report bugs to me.
For those unfamiliar with CSS, this essentially means that you can make the Monastery look (almost) however you'd like it to. Pick your own colors, fonts, etc. You should even be able to put the nodelets on the left, or do even more radical things. It's also a safe way benefit from the creativity of any monk interested in improving the site. Rework the Monastery in CSS... share your code... be merry. :-)
Of course, it wouldn't be any fun if there weren't any challenges, would there? As you're doubtless aware, if you've ever once peeked at the source code, the Monastery's markup isn't quite valid HTML. And there aren't a whole lot of DIV tags to make it easy to distinguish one section or element from another. And some chunks of text, like 'search' and 'PerlMonks' and 'The Monastery Gates', are actually images, so you really can't change them much with CSS. And there are probably a few other interesting features that aren't occuring to me at the moment.
The pmdev team is working feverishly, night and day, to fix these things... while still keeping the place safe for our handful of die-hard Netscape 2.0 users. :-). Indeed if you look, you may notice that the markup has improved a bit. For now, though, you'll have a bunch of stuff to work around. And as the HTML being generated will doubtless be changing, any very precise hacks you cook up stand in danger of becoming useless.
All in all, however, I find that you can do quite a lot with what's there already. As an example, I've cooked up a not-too-complicated example. Try pasting this into the Link to external CSS stylesheet box:
You may view this stylesheet as text here. Yes, it's a little goofy-looking for daily use... this is an example. :-) And, in the interests of full disclosure, it loads an image from my site, which means that if you use it I can find your IP, some stuff about your browser, and launch an attack upon your machine. Though in fact, I won't, unless I'm just astoundingly bored and it's too dark out to watch the grass grow.
Anyway, where was I? :-) Oh, yeah... stylesheets. A little history: I suggested this over a year ago... and I wasn't the first. But it wasn't a high priority, and at the time our Fearless Leader was doing all the development work singlehandedly, and nothing really came of it.
A little more useful and interesting than he'd intended, however. :-)
A few hours later, it occured to me: this thing let you put arbitrary strings into the head of every document you see on the site. The first thing I did was add </title><!-- to the end of my title, which sucessfully made a mess of the formatting and nodelets. Shortly thereafter, I cooked up a stylesheet and changed that to </title><link rel="stylesheet" href="http://www.brinzer.net/css/PerlMonks.css" type="text/css" /> Voila! I once again validated my gradeschool teachers' opinion that I was nothing but a troublemaker.
Anyway, I'm out the door... I'm having Lasik done within the hour, and I'm not certain how quickly I'll be able to use the computer again. Pardon me if I'm slow in responding. I hope everyone has fun with this, and at least one or two people are as excited about it as I am. :-)
Edit Petruchio Thu Feb 14 12:08:25 UTC 2002 - Minor grammatical correction, to alleviate the author's embarrassment.