Tips, Tricks and Troubleshooting
Overview
HTML templates are used to display the output from a color formula or the contents of the currently active palette in a web page.
Each template has a placeholder link to a stylesheet - this can either be a custom style sheet created by the template author, or one that ColorCache produces internally. All color information MUST be contained in the stylesheet. Color information that's specified in the HTML file will not be changed to reflect your chosen color scheme.
Color Information - Troubleshooting
In order for colors to be 'mapped' to ColorCache palette's and formulas it is important that the following rules are observed when creating or editing templates:
All color information should be included in CSS classes.
The following tag must always be included in the header section of the HTML:
<link rel="stylesheet" href="<<INSERTSTYLESHEET>>" type="text/css" />
If you want to make use of ColorCache's internally generated style sheet the "Use hand crafted CSS file" check box in the "Description" tab should be unchecked, and:
When specifying color in your HTML always use the CSS classes. For example:
<body class="BkColor01">
<p class="Color02">
See the HTML Tab help page for more information on internally generated CSS classes.
If you want to specify your own CSS file the "Use hand crafted CSS file" check box in the "Description" tab should be checked, and:
The CSS must be entered into the CSS tab (i.e. style information should not be specified in the HTML file).
Colors should be specified as color index placeholders and not literal colors. For example:
<<%n>>
Where 'n' is the index of the color (i.e. %1 refers to the first color in the active palette/formula; %2 refers to the second color..).
See the CSS Tab Help page for more information on style sheet creation.
Viewing HTML Previews - Troubleshooting
If you see an error each time the preview is generated then there may be some HTML code in the template that the preview control doesn't recognize. For example sections of javascript that call out to an external service. (e.g. urchin stats).
Tips and Tricks
Tinting images to blend with your color schemes.
To ensure that your images blend nicely with all of your color schemes simply place them over a colored area of your page and make them slightly transparent. For example, the following class will make your image 90% opaque - if you choose a red color scheme the image will have a slight red tint; place it on a blue background and the image will blend perfectly with your blue color scheme.
Simply add the following class to your style sheet:
.myimage {
FILTER: alpha(opacity=90);
-moz-opacity: .90;
opacity: .90
}
And apply it to any image that you want to make transparent.
| 
