Switching Styles

From PixyWiki

PixyBlog uses the javascript styleswitcher.js script written by Paul Sowder to allow users to switch between two CSS style sheets.

To include this script in your page template, add the following into the <head> of your page:

<html>
<head>
...

<link rel="stylesheet" media="all" type="text/css" href="$url.page("light.css")" />
<link rel="alternate stylesheet" media="all" type="text/css" href="$url.page("dark.css")"  title="dark"/> 
<script type="text/javascript" src="/roller-ui/scripts/styleswitcher.js"></script>

...
</head>

You will need two CSS style sheets; a default one and an alternative.

To switch between the two styles add the following HTML and javascript code into the <body> of your page:

Site Style: 
<a href="#" onclick="setActiveStyleSheet('light'); return false;">Light</a> /
<a href="#" onclick="setActiveStyleSheet('dark'); return false;">Dark</a>

For more information visit http://www.alistapart.com/articles/alternate/

Changing the default style of your pixyblog

You can also change the default style from light to dark (or vice versa); read our wiki article to find out how.

Retrieved from "http://wiki.pixyblog.com/Switching_Styles"