Provide multiple themes for same web page?

provide different theme for same page like msn space, bloggers sites

[compose]

Hello,

I am working on an application in which i have to provide theme selection option to users, means they can select any theme from theme gallery, and particular theme will be applied to there profile.

I had implemented this on small level using CSS but in that case i am able to just change color theme of site not content arrangement. So can any body help me in finding logic that how to implement this in such way that i can provide them different design templates regardless of content arrangements, i think Template Engines can help me in this like smarty or similar to that.

Please give your suggestions for this.

Thanks.

Regards,
Vinic

[mcibor]

With proper css you can do everything:

check CSS Zen Garden [Fwww.csszengarden.com] and their different layouts

Michal Cibor

However if you really don't want to use css, you can use smarty for that, however css is a neater solution

[compose]

Hello,

Thanks for your prompt reply and for link of Good CSS resource. I will try to implement this in my project.

Vinic

[henry0]

Been there, Done that :)
You will need to be very cautious on how each "Pure CSS" template will render its output/content
Since you mentioned smarty I suppose that your content will be dynamic
any CSS built works fine in a pre-defined environment
but if a col get a larger/longer content that it had before then most layouts will break.
So the trick is to be sure that you will use content that could be equivalent to height 100% and that if col B is longer that col A then col A will equal col B.

[mcibor]

I myself like to use table for dynamic layout:

eg.
<table><tr>
<td style="background-image: url(images/lefttop.png); background-repeat: no-repeat; width=40px; height=50px;">&nbsp;</td>
<td style="background-image: url(images/middletop.png); background-repeat: no-repeat; width=200px; height=50px;">&nbsp;</td>
<td style="background-image: url(images/righttop.png); background-repeat: no-repeat; width=40px; height=50px;">&nbsp;</td></tr>
<tr>
<td style="background-image: url(images/leftmiddle.png); background-repeat: repeat-y; width=40px;>&nbsp;</td>
<td style="background-image: url(images/middlemiddle.png); background-repeat: repeat-y; width=200px;">dynamic links, table, or whatever you wish. I have menu here</td>
<td style="background-image: url(images/rightmiddle.png); background-repeat: repeat-y; width=40px;">&nbsp;</td></tr>
<tr>
<td style="background-image: url(images/leftbottom.png); background-repeat: no-repeat; width=40px; height=20px;">&nbsp;</td>
<td style="background-image: url(images/middlebottom.png); background-repeat: no-repeat; width=200px; height=20px;">&nbsp;</td>
<td style="background-image: url(images/rightbottom.png); background-repeat: no-repeat; width=40px; height=20px;">&nbsp;</td></tr></table>

Only I have that not in style, but in css classes, but that's the same-only to show you and Henry example.
Regards
Michal

[compose]

Till now i also use table structure to display dynamic data and CSS to change color theme.

But in that case if i have to apply a theme with complete different design that i have to do separate coding to implement that.

So i tried to do this using DIV and CSS it is little time consuming.

So what you think template engine will be good idea for this or CSS.

Please give your suggestion.

[henry0]

If you wish you could still go with pure CSS
Here is what I will do
Get a few CSS layouts
Use some “loren ipson etc..” and check how they performed (with different content size loads)
Figure if you are able to fix the “100%” requirement problems.
If you can make it working then you are done
Otherwise start as Michal suggests and plug all CCS directives in tables

What I do:
Start with a pencil and paper
Draw a rendering of the desired site overlook
Think about the content
How that content is going to be driven, how much space is dynamic content generated
And how you may precisely govern content size and use pagination etc..

With those parameters worked out then you are ready to give it a shot and make an educated decision.