Topic awaiting preservation: using themes on your site... (Page 1 of 1)

I have one new version that I am going to use for my site and I think I am going to use version 2 and version 2.2 as themes on my site. So this is what I have 3 'themes'. What is the best way of making it work!? Just uploading three different 'themes' and the content or is there any other way!?

You can see version 2 and 2.2 here: http://www.ozoneasylum.com/Forum6/HTML/000828.html

a r t i f i c i a l g r a p h i c s

Need more info!

What exactly do you want to do? Make it so that the user can pick their theme? or display randomly?
Either way I'd do this with PHP. You could use a data base for this but it shouldn't be necessary. What I would do is put all the content sections into flat file that you would include depending on the theme.

Looking at these it looks like all you need to do is swapout a couple of graphics and your style sheets depending on the different themes. so I'd do something like this

1. Set the different themes in you Query String http://www.whatever.com?theme=2

2. Make a default theme at the top of your code.
<? if (!$theme) $theme = 1; ?>

2. Then in your page wherever you need to put a different graphic do this:
<img src="images/whatever_<?= $theme ?>.gif">

3. of course your style sheet is this
<link rel="stylesheet" href="css/theme_<?= $theme ?>.css">


And that should do it.
You could even do this via an SSI echo if PHP isn't availible to you.

Then from here you can get as complicated as you want by setting cookies to remeber user settings etc.



:[ Computers let you make more mistakes faster than any other invention in human history, with the possible exceptions of handguns and tequila. ]:

[This message has been edited by bitdamaged (edited 02-26-2002).]

Ok, I kind of understand what your aiming at, but I just started using PHP and I don't know everything I need to know about it yet. So, could you help me out a bit?

so I have to make a default theme, how can I set the default theme!?

And where I place the graphics that need to be changed, when the other theme is selected, all I have to do is put this: _<?= $theme ?> in the url to the image!? And the same works with the stylesheets, right!?

And a link would include this: ?theme=1 or this: ?theme=2 to link to the first or the second theme!?

Can you tell me a little bit more about it? Or could you give me a link to a tutorial or something!? Because I need to know a little bit more then just that, thanks in advance...

a r t i f i c i a l g r a p h i c s

That's exactly the way Sash does it. Reference this thread. It's very simple, and very nice.

Actually what I printed up there is about all the PHP you need.
But a little more explanation.

When you put something in your querystring like this http://whatever.com?theme=1
PHP automatically creates a variable called $theme that's value is "1", so that's already done before we've written a line of code.

The thing is if there is no query string then there is going to be no variable called $theme so thats what this line does is check to see if $theme is there and if not then set it to our default "1" so this is the beginning of our php doc
<?
if (!$theme) $theme = 1;
?>

Okay so now $theme is either set to whatever was in the query string or our default. You don't have to use number's here Sash used names/colors and that's fine.

So now all I do differently is that I don't have PHP write out the whole lines to call the stylesheet. I cheat a little bit and use this (outside of the PHP tags)

<link rel="stylesheet" type="text/css" href="/css/theme_<?= $theme; ?>.css">

Now after the page is parsed if $theme is set to "2"you'll have a link that says
<link rel="stylesheet" type="text/css" href="/css/theme_2.css">

so you can just name your "2" theme's css page "theme_2.css"
I use the same trick for any images, this:
<img src="images/whatever_<?= $theme ?>.gif">

Will turn into this:
<img src="images/whatever_2.gif">

Make sense?
our whole doc (simple page only one image) could look like this:

<?
if (!$theme) $theme = 1;
?>
<html>
<head>
<link rel="stylesheet" type="text/css" href="/css/theme_<?= $theme; ?>.css">
</head>
<body>
<img src="images/whatever_<?= $theme ?>.gif">
</body>
</html>


And that's it!
Now to get more complicated you could set a cookie when someone picks a theme but I don't have time to explain all that right now someone else might do the favor it's pretty easy.




:[ Computers let you make more mistakes faster than any other invention in human history, with the possible exceptions of handguns and tequila. ]:

CryoniX: A simple way would be to use switch:
www.php.net/switch

so you'd have:

<?php



switch ($theme) {

    case 'red':

        $stylesheet = "red";

        $title_graphic = "red_title";

        $top_left_graphic = "red_top_left";

        ETC.

        break;

    case 'blue':

        $stylesheet = "blue";

        $title_graphic = "blue_title";

        $top_left_graphic = "blue_top_left";

        ETC.

        break;

    default:

        $stylesheet = "grey";

        $title_graphic = "grey_title";

        $top_left_graphic = "grey_top_left";

        ETC.

        break;

}

?>

and then drop the bits into your page - using bitdamaged's code:

<html>

<head>

<link rel="stylesheet" type="text/css" href="/css/theme_<?= $stylesheet; ?>.css">

</head>

<body>

<img src="images/whatever_<?= $title_graphic ?>.gif">

</body>

</html>

I'm not sure I would personally take the value from the url and slot it straight into the page as people could fiddle with the URL and break your page - the way I've outlined things even if the do mess the url up then they get the grey theme. There might also be security implications if one were unwise in their coding!!

[edit: And then I check Pugzly's link and he does pretty much the same thing there!! There is nothing new under the sun]

Emps

[This message has been edited by Emperor (edited 02-26-2002).]