Creating Templates

I think a css based template system would be nice... hows it coming along MrLEN?

Creating Templates

I am quite established with creating CSS pages that use only div's and not tables. I make pages that are cross browser frienly, W3C compliant, fast loading and search engine friendly.

I will make a CSS version for newezone, then I will modify it and make a default one for StoryTeller. Then I will send it over to you, and you can add it as a theme, or make it downloadable from the site.

I just have to figure out where all the files are that hold all the parts of the templates and modify them.

As a matter of fact, if there is only one set of default template files, you might want to drop the use of tables period, and start using the CSS version that I create.

I'm sure many people would rather a CSS template, because then then, once installed, the entire site can be updated merely by editing the css.

In my opinion, there should be absolutely no HTML in the templates. Just div's and classes everywhere that can be controlled via CSS.

I am going to make a CSS version for newezone. Once I show you that I can get it working with absolutely no problems, would you consider using it? It ill just take me a bit of mucking around to work out where all the files are. I'd hate to do it vie the cut and paste method in the StoryTeller admin.

..ah, I'll work it out.

MrLeN

Creating Templates

Each Instant Style include only a color scheme and not templates

You find all styles in the /templates/original/themes directory.

Here as example the demobox (demobox.thm.php) style:

<?php



$theme_name = "Demobox Theme";



$color1 = "#ffffff";

$color2 = "#000000";

$color3 = "#33ccff";

$color4 = "#000080";

$color5 = "#dddddd";

$color6 = "#004ea4";

$color7 = "#a8d2ff";

$color8 = "#ffffff";

$color9 = "#004365";

$color10 = "#004365";

$color11 = "#004365";

$font1 = "Verdana, Arial, Helvetica";



?>

$theme_name = "Demobox Theme";

This is the style name. You could change this to $theme_name = "My Style"; or whatever you want.

$color1 = "#ffffff";

$color2 = "#000000";

$color3 = "#33ccff";

$color4 = "#000080";

$color5 = "#dddddd";

$color6 = "#004ea4";

$color7 = "#a8d2ff";

$color8 = "#ffffff";

$color9 = "#004365";

$color10 = "#004365";

$color11 = "#004365";

$font1 = "Verdana, Arial, Helvetica";

These values based on the extended mode of Instant Styles:

Background color => $color1
Text/border color => $color2
Main header background color => $color3
Main teaser background color => $color4
Main background color => $color5
Table header background color => $color6
Table teaser background color => $color7
Table text background color => $color8
Link color => $color9
Link color (visited) => $color10
Link color (active) => $color11
Default font => $font1

To create your own Instant Style, just change all values and the file name to mystyle.thm.php (example)

Then you need to create a preview picture as PNG and upload it to /templates/original/themes/preview/mystyle.png (if the theme file is called mystyle.thm.php)