Implementing a style switching page
Posted by mholmes on 31 May 2007 in Activity log, Tasks
We now have three distinct styles for the site, and we need a way to switch between them, and store the user's preference. After a bit of reading around, I think this is the best approach:
- Implement a style page which allows the user to preview the styles and choose one.
- Choosing a style sets a cookie in the user's browser.
- Sitemap pipelines for rendering pages follow this example to branch based on the value of the cookie.
- Instead of branching to different stylesheets, the XSLT stylesheet is the same in each branch, but different parameters are passed to it, as in the second example snippet on this page.
- The XSLT stylesheet inserts different CSS in the output (one file in the case of regular pages, and two files in the case of the imgae markup pages) depending on the value of the parameter passed to it.
This would be a good approach to building the functionality:
- Tweak the XSLT code to use a parameter to determine the CSS to use, and give it a default value (the current preferred style).
- Create test pipelines using slightly different URLs which pass other parameters in, and make sure that the stylesheets do switch appropriately.
- Make the real pipelines branch based on the cookie value. At this point, the cookie doesn't exist, so we should always see the default style.
- Hack the cookies in your browser to add appropriate values, and check whether the style is switched appropriately. Try this in various browsers.
- Write the stylesheet switching page, and test it thoroughly.
- Add the stylesheet switching page to the site menu.
Adding this as a task.