Alowing end user to have specific CSS rules they can modify

Question

I would like the user to have limited access to controlling certain CSS attributes of divs. The divs would all be similar, all have a some class name, and be displayed across the site with the styling rule of the user. So kind of like a user CSS stylesheet, except with certain rules that they can change.

Allow change to:

.className{  
   font:all attributes;  
   all four borders:all attributes;  
   float:cannot change;
}

Would the best way to be to store these in a database? Store the color, border width, etc in a MySQL database? Seems like a lot, with all of the information.

Allowing the user to have their own CSS document is risky, and I do not want them to be able to change the layout. I want to make this a part of my site, one anyone can use with no knowledge of CSS. I would like for them to have their choice of styles; like letting them have their own theme on a Drupal site, but make the changes easy to make for anyone (like have a list of pre-defined or something). But also they must have full control if they want, of the attributes I allow them to change.

Would preprocessing this information from a database and putting it in a style tag be inefficient? Seems like a lot of queries unless it was all in one query.

Answer 1

To have your users able to generate and preview the styles dynamically, they must be parsed with Javascript (or server side to get tricky). Either way, you have to get a CSS rule out of it somehow, so you might as well do it before you throw it into the database. You're doing what you were going to do anyway, but saving yourself the trouble of making a big table.

Answer 2

You should check out the jQuery UI ThemeRoller script, it uses a number of fields which are passed via the URL. Click on any of the themes on the left and see what happens to the URL.

You could easily replicate it to fit your needs, and instead save those values in a database. You could use the same naming convention too, if you like.

I think it's a great place to start.