Image colors from a database

Posted on 2005-04-27
Last Modified: 2010-04-06
I'm not really sure in which topic are this should be as which language to do this is part of my question.

I'm developing a templated based CMS solution. Each client has their own website and the content is drawn from a DB and put into the page. Each client designates a set of colors for the theme of their site (colors 1-4), the problem is i want to start putting graphics around the pages, and using graphical buttons instead of standard form controls. However i can't just create a standard set of buttons because they won't nesscarily look good in the theme next to the clients colors. and because each client (100+) specifies their own colors i can't legislate for this.

Is there anyway i can use graphics on a page where some element of the color is drawn from a Database?

The pages are written in ASP, but i would consider using any language to fix this problem as long as it will work in an ASP page
Question by:alex_wareing
    LVL 30

    Expert Comment

    ImageMagick does all kinds of image manipulation: (their site is currently down).
    ImageMagick is not meant to be used with ASP, but it seems it can be done using some OLE component...  You can search google for more info on the subject.
    LVL 4

    Accepted Solution

    To be honest, I'd cheat... :D I would use ASP, pull the colours from a DB, and design my buttons as gifs. The bits I wanted to be coloured, I would set as trasparent - and then I'd put the images in divs or table cells with a background colour selected from the db. What you'll get is a consistent look and feel, but you'll be able to use absolutely any colour you like...

    If you really want images designed on the fly, I'd recommend ChestySoft's csImageFile - I've used this component with ASP loads of times, and it rocks - very quick, memory efficient, and works at high volumes.

    I reckon the partially transparent gifs idea is the best way forward though :)
    LVL 5

    Expert Comment

    and to keep the display part seperated from content I'd use CSS. Just an addition, totally agree with Fuzzyfish - all point for him

    Author Comment

    Fuzzyfish1000 - i have thought of this approach before however, what can i do if i want rounded edges and the page background could be any color?
    LVL 1

    Expert Comment

    If you only have 4 colors to choose from (colors 1-4) then it shouldn't be hard to make the same button with each of the possible combinations.  Granted, as you expand the color offering, this could come out to be a large number of images, but if you have the space for it, it keeps you from having to perform run-time image processing.  You could then name the buttons with a code stating which combination of colors they use and use the customers color setting to determine which image to load.  Ie, if the customer has chosen color 3, then their button would be /images/submitbutton3.gif, whereas another customer may load /images/submitbutton2.gif.  If there are two colors that would affect the button, you just expand the code on the end.  Ie, if the customer has chosen 2 as the highlight color and 3 as the base color, your img src= becomes /images/submitbutton2-3.gif.  This same technique could be carried forward into any number of combinations.  Also, it could be written that the 2-3 combination for an image used in the title would not be the same colors as a 2-3 combination used in the footer.  It is just a matter of the code knowing which portion of theme affects the image you are loading.  It is feasible that even if the theme allows the selection of colors for 60 different areas, only one or two of the colors would affect any given button, so you wouldn't have to have the submitbutton with 4^60 different images (60 color areas, each with a possible choice of 4 colors) but would instead only have 4^2 (2 colors affecting the image, with those two chosen from 4 colors).
    LVL 4

    Expert Comment

    I guess you've got to decide how much flexibility you actually need - I often get clients approaching me and saying things like, we want a database that can accept any sort of input, or I want to be able to completely re-design the layout of my site without any technical knowledge - at which point I stop them, and get them to consider their actual requirements. I would want buttons of any colour, with any shape, and with any background, I'd suggest you may want to fix yourself to a specification, or at least a set of limitations.

    For instance, it would be quite easy to produce buttons with rounded edges, with transparent parts for changing to any colour, that would look good on a white background. I don't suppose once you've done one set, it would take you long to create 10 sets of buttons, for 10 sets of background colours. Your only other alternative is to dynamically create the images using an object like the chestysoft one - or use flash or Java (which I wouldn't recommend). The downside of dynamic creation is it doesn't lend itself to high-volume traffic websites, without a lot of server power behind it.

    If you compromise and have square edged buttons (even with drop shadows or similar), you can use the table background with transparent sections solution just fine...

    Featured Post

    Free Trending Threat Insights Every Day

    Enhance your security with threat intelligence from the web. Get trending threat insights on hackers, exploits, and suspicious IP addresses delivered to your inbox with our free Cyber Daily.

    Join & Write a Comment

    Preface This article introduces an authentication and authorization system for a website.  It is understood by the author and the project contributors that there is no such thing as a "one size fits all" system.  That being said, there is a certa…
    This article covers the basics of the Sass, which is a CSS extension language. You will learn about variables, mixins, and nesting.
    Viewers will learn about the regular for loop in Java and how to use it. Definition: Break the for loop down into 3 parts: Syntax when using for loops: Example using a for loop:
    The viewer will receive an overview of the basics of CSS showing inline styles. In the head tags set up your style tags: (CODE) Reference the nav tag and set your properties.: (CODE) Set the reference for the UL element and styles for it to ensu…

    730 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    15 Experts available now in Live!

    Get 1:1 Help Now