PDA

View Full Version : Loading additional CSS


nauz
05-09-2005, 11:21 PM
Anyone know of an easy way of loading different CSS files into image_template.html?

bloodRoot
05-10-2005, 04:10 AM
To use a different stylesheet for just the image_template.html page, you can change this tag in the head section on that page.
<link rel="stylesheet" href="templates/pixelpost-light/pixelpost-light.css" type="text/css" />

If you already have a new CSS file, just replace pixelpost-light.css with the name of your new stylesheet. Save the page and upload image_template and your new CSS file to your server, in the same folder they were in.

If you don't have a new CSS file you can make a copy of the existing stylesheet, rename it to something else, then make your style changes. Then follow the step above.

Connie
05-10-2005, 06:41 AM
what do you mean:

- another css-file then the one in the header of the template?
just change it

- different templates? One for print, one for screen etc.?

- just add these in the header:

<link rel="stylesheet" href="screen.css" media="screen">
<link rel="stylesheet" href="print.css" media="print">


or do you want to have a style-switcher that the user can choose which style he wants to see?

There are many examples around for that...

Joe[y]
05-10-2005, 06:52 AM
<link rel="stylesheet" href="templates/pixelpost-light/pixelpost-light.css" type="text/css" />

Assuming something like above is your current CSS link.. just change it to something like:

<link rel="alternate stylesheet" href="templates/pixelpost-light/pixelpost-dark.css" type="text/css" />

You now have two stylesheets. Try www.alistapart.com if you want to turn this into a functional styleswitcher.

nauz
05-10-2005, 01:54 PM
what do you mean:


or do you want to have a style-switcher that the user can choose which style he wants to see?

There are many examples around for that...

Sorry should have been more specific. I wanted a way to switch the CSS on the page.

Some photos look better on dark, some light.

Now that I look, JSpurling's site has a button on his site:
http://www.jlspurling.com/ at the bottom.

Code on the button is:
<a href="#" onclick="setActiveStyleSheet('White'); return false;">white</a>

I guess I'll research "setActiveStyleSheet" function.

Joe[y]
05-10-2005, 05:27 PM
this is actually a javascript file but it's easily translated into php which is obviously more user friendly:

go to : http://www.alistapart.com/articles/alternate/
and : http://www.alistapart.com/articles/phpswitch/

nauz
05-11-2005, 02:14 PM
THX Goat Friend. I got it working. Now I just need to redesign a nice CSS to load into it.
-N