How to make a skin
Creating a skin is really simple. Even I can do it, so it has to be pretty basic
;-)
Seriously, a skin template consists of 4 parts. It's so very easy
Note name is simply a way of defining different templates, it has nothing to do with anything else
- name.head-stuff
name.css
- name.nav-stuff
- name.foot-stuff
name.head-stuff is simply (On current skins) everything that's in the header bar, along the top. Where you have [commonroom.org] and such. In head-stuff you do all funky graphics pre-loading and other header type stuff
name.css is the style definitions. Every definition you want to make should be in here. The idea being, there will be a CSS template for you to work to (Once it's been done *looks at Neil*) No longer required. All style definitions go in the header
name.nav-stuff is currently the navigation bar down the left hand side of your browser window
name.foot-stuff is everything below the content (e.g. all this text)
Now then, making skins less static. Here's how
In the template, when you want the current page name to appear (This page is called skin_design, but would be displayed on screen as skin design), simply have !page! wherever you want it to appear. Like this skin design
Why is this of any use?
Well, you can display certian images depending on the page, for instance <IMG SRC="!page!.header.jpg" ALT="Header image for !page!">
Or, you could replace [commonroom.org] with Viewing !page!
The scope is pretty much only limited to the number of varibles already set
Ok, so I've run out of options. If people want !options! added, then just ask, but give a reason for wanting it added
Pages are processed like this: -
name.head-stuff, name.css and name.nav-stuff are read, processed, then sent to the browser. Then, the content is processed, and sent. And finally the footer. That's the order things are done, there is no way around it. Well, not unless you give me a reason to change it about, that is
A final thing, the links you see across the bottom of the page, they're added using !footer!, which will always produce
[Home]
[Forum]
[Prom 2001]
[2003 leavers]
[2002 leavers]
[2001 leavers]
[2000 leavers]
[Add your details]
[Links page]
[Add your link]
[Webring]
[Change skin]
[Skin info]
[Skin design]
[Site admin]
[About the site]
[Site staff]
Bit, it's up to you (And your CSS) how this looks. This can be placed pretty much anywhere in your template, as can any of the !options! |
|