Tuesday, May 24, 2005

Spectre the Owl

A bunch of people have asked how the owl floats up in the corner there. He's called Spectre, by the way. Say hi to Spectre.

Anyway, here's how you do it: Cascading Style Sheets, or CSS for short. You can read all about it at the W3C Schools - but then again, you just want a pic floating in the background. So, skip that, here's the skinny. (This is kind of based on blogger.com, but it'll be very similar for all the blog software.)

1) Pick a pic.
2) You might have to do some work with a graphics package to pick out a subject from your photo, and then make the rest of the background transparent.
3) Save the pic somewhere on the web that you can access. You need to know the address of where you store it.
4) Open up your blog's template and look for the style info. It'll be near the top, and will look like a lot of lists in between { curvy braces }. It'll be after a tag that says <style type="text/css">.
5) Find the bit that says body {
6) After the bit that says body { find the bit that says background: #xxxxxx ;(the #xxxxxx could be a bunch of numbers and letters.)
7) Change that line to read something like:
background: #000000 url(http://theaddressofyourimage) no-repeat fixed right top;
8) Save your template, republish your blog.

Hey presto! Your pic will stick in the top right of the blog when you scroll. If this is unclear at all you're welcome to ask for more help. :-) (Go to www.neilwhite.org.uk)