I've once again managed to frustrate myself. I thought it would be fun to allow visitors to my site to choose between a couple different stylesheets. So, using code from an AListApart.com article, I tried to implement it. On my index page, it works fine, but I am confused as to how to apply the user chosen style to the subpages of my site. I add the stylesheets as follows. There is a preferred stylesheet and two alternate stylesheets:
<link rel="stylesheet" href="/css/style-default.css" type="text/css" title="default" /> <link rel="alternate" href="/css/style-green.css" type="text/css" title="green" /> <link rel="alternate" href="/css/style-citrus.css" type="text/css" title="citrus" />
My question is: What do I include on subpages so that the chosen style is displayed?
Here is the behavior I'm seeing: If the default style is kept, the site displays fine as it is the preferred stylesheet. However, if another style is chosen, all others are disabled, and when I go to a subpage there is no style at all. Could the script not be working right? Or maybe I should just go to bed.
My site: http://www.nicoleswan.com
Site sub-page trying to use script: http://www.nicoleswan.com/archives.html
Script path: http://www.nicoleswan.com/scripts/styleswitcher.js
You need to include all those style links and styleswitcher.js into every subpage as well.
Then when the page loads, the styleswitcher functions will look for a style cookie and set the page style to what the user previously chose.
Oh, also, the alternate stylesheets should have the rel attribute equal to "alternate stylesheet" rather than "alternate", iirc.