Styles Dynamic CSS creation let customer choose styles

[windows7ni]

Hi Folks,

I am currently developing a website builder program for a private project and I am at the design stage where users can choose various styles in the admin area. This has not been implemented yet as I dont know how exactly to do it.

Basically the customer is to be able to choose (or make up) their various styles (Not a basic CSS selector) but to be able to select various elements and perhaps a colour chart comes up and allows them to dynamically change it in real time before the page is created. The layouts will likely be predetermined unless anyone has a better idea i'd be open to hearing it.

The system is written in PHP and there is an SQl database to hold other info like page content references etc. Also what way would you suggest doing this so that the style the user ends up with is written to file/database so that when the website is created it can be used and not a temporary feature. Basically the user is to create their own website and have easy but extensive control on look and feel.

Hopefully I have explained this okay and I look forward to any ideas on how I can achieve this.

Thanks in advance

[djr33]

You'll need to look into templating. There's lots of information out there, but it's not all that easy to do.

You will need to generate different HTML if you want the user to actually be able to control the layout. If you just want the styles to change, then you can use one set of standard HTML and then change the CSS. But that won't give infinite freedom.

For the CSS, there are two options:
1. You can generate a number of stylesheets and let them choose which they want. This could even (if you want) be 1,000s to choose from, including all possible combinations. So they could be "designing a custom stylesheet" but that really refers to one that is prebuilt. So that's just about how you do it technically, and if you really want to pre-generate 1,000s of them.
2. Alternatively you could make dynamic CSS stylesheets using PHP. It's easier to do this inline, but less efficient, so I'll just link you to some information about making an external dynamic ".css" file (actually it will be .php but work in the same way):
http://www.dynamicdrive.com/forums/showthread.php?t=21617

[windows7ni]

Thanks for this, this should help me out :) Well the layouts will be set and the user has no control over that (yet) lol but it was really giving them the opportunity to change colours of backgrounds etc nothing too overly complicated. The system is to allow people to build web pages without programming experience and uses WYSIWYG editors etc

This is very useful and a great tutorial. For getting values from the database what way would you suggest the user being able to tweak colours and storing it in the database ? E.g Should I allow a JQuery colour wheel for example to let the user choose a colour then store it in a database to be read to file as in your tutorial?

After this I think I'll be able to get coding :)

Thanks again

[djr33]

If you're planning to use a dynamic CSS sheet, then you can use any color values you'd like. If you do decide to use the somewhat simpler option of a set list of possible stylesheets, then you can probably limit the color choices using a dropdown menu.

But since it sounds like you're using the dynamic option, then I don't see why you need to limit it at all. Accept any six-digit hexadecimal code (eg, 000000, or AA33FF), then apply that. So you'd just have a database that stores user styles, with a column for color1, and another for color2, etc.

As for how to select that color, that's your choice. Most users probably won't be able to type in a color code, so giving them a color wheel is a good idea. It can be a little difficult to setup, but it will probably be fine. So, sure, go with that.

[windows7ni]

Thanks for your quick response. That sounds like an excellent idea. I'll let you know how it works out.

Thanks again