Theme Script - Finishing Touch

Hey guys, just need a little help finishing this script.

I want to use themes on my site, and its the first time iv even tried to lol. I didnt know which way to go about it, so i decided to try javascript. I found some code that alloued me to switch between different stylesheets which works great, but i need to know how I can save the theme selected, and use it to load the theme on other pages.

The script I found can be seen here:

http://www.alistapart.com/articles/alternate/

It basicly uses something like this;

<!-- Default Theme -->
<LINK REL="StyleSheet" HREF="themes/antone/style.css" TYPE="text/css" title="bog standard" />
<!-- Other to choose from -->
<link rel="alternate stylesheet" type="text/css" href="themes/THEMENAME/style.css" title="THEMENAME" />

in the head of the script then a link to change the themes,

<a href="#"
onclick="setActiveStyleSheet('paul');
return false;">change style to paul</a>

It also includes a JS file which contains the fllowing:

function setActiveStyleSheet(title) {
var i, a, main;
for(i=0; (a = document.getElementsByTagName("link")[i]); i++) {
if(a.getAttribute("rel").indexOf("style") != -1 && a.getAttribute("title")) {
a.disabled = true;
if(a.getAttribute("title") == title) a.disabled = false;
}
}
}

function getActiveStyleSheet() {
var i, a;
for(i=0; (a = document.getElementsByTagName("link")[i]); i++) {
if(a.getAttribute("rel").indexOf("style") != -1 && a.getAttribute("title") && !a.disabled) return a.getAttribute("title");
}
return null;
}

function getPreferredStyleSheet() {
var i, a;
for(i=0; (a = document.getElementsByTagName("link")[i]); i++) {
if(a.getAttribute("rel").indexOf("style") != -1
&& a.getAttribute("rel").indexOf("alt") == -1
&& a.getAttribute("title")
) return a.getAttribute("title");
}
return null;
}

function createCookie(name,value,days) {
if (days) {
var date = new Date();
date.setTime(date.getTime()+(days*24*60*60*1000));
var expires = "; expires="+date.toGMTString();
}
else expires = "";
document.cookie = name+"="+value+expires+"; path=/";
}

function readCookie(name) {
var nameEQ = name + "=";
var ca = document.cookie.split(';');
for(var i=0;i < ca.length;i++) {
var c = ca[i];
while (c.charAt(0)==' ') c = c.substring(1,c.length);
if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
}
return null;
}

window.onload = function(e) {
var cookie = readCookie("style");
var title = cookie ? cookie : getPreferredStyleSheet();
setActiveStyleSheet(title);
}

window.onunload = function(e) {
var title = getActiveStyleSheet();
createCookie("style", title, 365);
}

var cookie = readCookie("style");
var title = cookie ? cookie : getPreferredStyleSheet();
setActiveStyleSheet(title);

Like i said i just need a way that I can remember what theme the user wants, then i can work around the rest.

Thanks for your time ;) :thumbsup:

That code sets a cookie for the entire site. You just have to include that JavaScript on every page that you want the selected style to be used on so it can read the cookie and select the script.

If you have another window.onload defined somewhere else one of them won't work but that's not too hard to correct.