Project Skins/Custom Headers

Making a custom header

A custom header begins with standard HTML document headers and ends where the page content should begin. Do not leave open HTML elements (eg table, div). Name files header.name.html and header.name.css if using an external stylesheet.

Don't use any headings other than H1. Use class styles to create exceptions for A, P, IMG and any other tags you use in the header. Remember to be as strict as possible, eg. for IMG tags set border to zero, background to inherit, margins to zero, etc, as the main content stylesheet may have set these and you need to override them back to normal. (I discovered this just now when I uploaded the Textbook stylesheet and found that the stuff I've set for images and paragraph indents altered the header.)

For content styles you can:

import the user's current choice (ahead of the header stylesheet, so the header sheet creates exceptions)
import a particular content stylesheet from the list above
import a new content stylesheet – in this case you may as well have ALL styles for both header and content in a single CSS file.

The following placeholders are replaced by the script:

Text

%windowtitle%: intended for the HTML TITLE tag: gives the site name and page name
%title%: the page title
%quip%: inserts a random quip from the quips file

Styles

%url%: base URL for stylesheets and other files you may need for layout eg logos, buttons etc.
%contentstyles%: will insert full URL for the user's currently chosen stylesheet. If you don't link this in, add a * to the end of the header name.
%logo%: inserts full URL for the site's default logo

Project Skins/Custom Headers

Making a custom header

Text

Styles

Links