Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations gkittelson on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Single-codebase Multi-client: how to offer color options 2

Status
Not open for further replies.
OsakaWebbie

OsakaWebbie

Programmer
Feb 11, 2003
628
JP
I'm setting up an online application that will have a single codebase for ease of development, but separate client databases. I want to keep most of the CSS in the common spot, because as I add features I'll need to add to the CSS files also - I only want to have to do that once instead of over and over for each client. But I would like to be able to offer each client their own logo and matching color theme - logo is no problem, but colors pervade all through the CSS (the same few colors being used for many different types of objects), so I don't see how I can keep things consolidated.

Ever since I started working with CSS, I have wished for the ability to define my own color constants. There are predefined ones like "White", "DarkRed", "LightSteelBlue", etc., but if I could define additional ones, like "PrimaryDark", "SecondaryHighlight", etc., I could simply define them in the client's file and use them in the common file. But there is still nothing like that, right?

Does anyone have an idea of how I can organize my CSS to allow color choices but still have my styles somewhat consolidated? The only way I can think of is to keep the colors in a database table and have PHP build the CSS right into the page output (<style> tag), but then I lose the speed of a CSS file that can be cached.
 
Sort by date Sort by votes
Instead of using the normal <link rel> tag to include your CSS, Why not build a PHP file that contains all your CSS with defined PHP variables for your colors, and then include it using PHP so the code gets run.

By including it in the right locations your CSS can be updated by PHP using colors from a database if you need to, but will still function as a single CSS file.

Code: 
<?PHP
$colorA="#449900";
$colorB="#22AA66";
...
?>

#objectID{
background-color:<?PHP echo $colorA; ?> ;
}
...

.className{
font-family:Verdana;
color:<?PHP echo $colorA; ?> ;
...
}
...


Then in your main HTML/PHP file:

Code: 
...
<html>
<head>...
<style type="text/css">
<?PHP include("mystylesheet.php");
</style>
...




----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Behind the Web, Tips and Tricks for Web Development.
 
Upvote 0 Downvote
Thanks for the reply. Your suggestion is very similar to what I was thinking when I wrote the last sentence of my OP (from the browser's vantage point it is the same), with the same drawback that it will never get cached. But maybe I have no choice.
 
Upvote 0 Downvote
you could have them as CSS files that get regenerated everytime the colours are changed for that client via an Admin screen for each client so that then the file is actually a CSS file and can be cached.

Greg Griffiths
Livelink Certified Developer & ECM Global Star Champion 2005 & 2006
 
Upvote 0 Downvote
I think you're saying that the CSS file would be separate for each client? That was the way I originally planned to do it (in fact, I was going to allow CSS-savvy clients to edit their own CSS, although that might have become a can of worms), but then I realized that as I continue to develop the interface screens, I would need to add/modify the CSS to match the new/modified HTML, so if all the CSS was separate by client I would have to run around and edit everyone's CSS for every upgrade.

Hmm, I suppose I could write a utility in PHP that takes a master CSS file, inserts each client's colors, and saves it in their directory. I would run it each time I either upgraded the master CSS or changed a client's colors. The utility would be a bit of a bear to write, but it's conceivable.

BTW, you mentioned the idea of an admin screen to let them choose their own colors rather than having me do it. That would be great (like is offered to YouTube channel owners), but the preview functionality that would be required seems like an unbelievably huge chunk of programming, way beyond the amount of time I have to do it (I am the sole developer, hand coding in mostly PHP/HTML/jQuery). If you know of some sort of tool, jQuery plugin, etc. to make that easier than I am envisioning, please enlighten me. In the same vein, my app generates PDFs for printing labels of the database data, based on a "layout" to specify the margins, labels/page, label size, and font sizes - I have imagined an interface for users to create their own layouts with a live preview, but it's the same sort of thing as the color preview - it sounds really hard. Perhaps if there is a tool out there, it might be relevent for both those tasks.
 
Upvote 0 Downvote
Hi

OsakaWebbie said:
Hmm, I suppose I could write a utility in PHP that takes a master CSS file, inserts each client's colors, and saves it in their directory.
Click to expand...
Before writing your own solution, take a look at LESS, Sass, xCSS, HSS, CleverCSS. They enhance the CSS syntax with variables.


Feherke.
 
Upvote 0 Downvote
Sweet! At first glance I like xCSS, because I'm already working in PHP so it's familiar, but they all look nice in their own way.

I explored the idea of an interface to help clients choose their own colors - the only thing I found was ColorizeIt's "advanced integration", which is a service controlled by the creators, not code I integrate with my stuff, so it might be cumbersome. If anyone knows of something else, just holler.

I gave two stars - Feherke's post had concrete things I can use, and ggriffit sparked the thought that eventually led there. I love the Tek-Tips community!
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

bdwilcox
  • Locked
  • Question
More efficient / manageable way to code this HTA w/ VBScript?
Replies
0
Views
680
bdwilcox
bdwilcox
Mike Lewis
  • Locked
  • Question
How to refresh a Javascript file in the browser's cache?
Replies
4
Views
1K
Mike Lewis
Mike Lewis
jizzer
  • Locked
  • Question
HTML/CSS Image map with multiple tool-tips
Replies
3
Views
1K
spamjim
spamjim
soni21
  • Locked
  • Question
JavaScript String to Number Conversion in HTML: Seeking Clarification
Replies
4
Views
1K
Chris Miller
Chris Miller
Expoverse
  • Locked
  • Helpful tip
Solution to CSS Two Level Horizonal Menu 1
Replies
1
Views
720
pmonett
pmonett

Part and Inventory Search

Sponsor

Back
Top