27
Rochelle
The day may come when you decide to modify the colors to your niche store. But you may be one of the many who has no idea how to go about doing this. To help you (and myself) I’ve gone through the entire css code of a Build A Niche Store (aka BANS) template and made screen prints of each change you can make. Some templates may be slightly different than what you see here but I have every confidence that you can figure out the differences ; )
First, a brief explanation of what this is about. Color codes are desiginated by six characters made up of numbers and/or letters. For example, the HTML code for white is ‘FFFFFF.’ It does not seem to make a difference if you use capital letters or lower-case letters in your color codes. (For a more detailed explanation of how colors are created see the bottom of this page.)
How to change colors on your site: |
|
|
Step One
|
|
| Log in to your site’s Admin and click on the ‘Template‘ tab and ‘styles.css‘ link for the template you are using. | |
| Step Two | |
| Save a copy of the original code (click here for instructions on how to do this). | |
|
Step Three
|
|
| Decide what area of your store you want to modify. Use the breakdowns below to find the exact part of the code to edit and replace it with the color you want. You will replace the six-digit color code and leave the # sign in front of the six digits. | |
| For example, if you want to change black to blue you will change the following: | |
|
|
| Step Four | |
| Save your changes and view your site to review changes. | |
| Note: If you view your store and don’t see any difference try hitting your refresh (F5) button. You may need to do this several times before you see a difference. | |
|
done
|
|
What section of your store do you want to edit?
- Logo (Header)
- Background
- Main Template
- Search Box
- Sidebars (Site Navigation / Store Navigation / Sponsored Links)
- Auction Results
- Footer
What follows is a detailed explanation of HTML colors (as kindly given by BANS member Lionmom and posted here with her permission):
"Just to let you all know, if you don’t already… In the hexadecimal color system,
The first two letters/numbers govern the color red
The second two letters/numbers govern the color green
The last two letters/numbers govern the color blue
The notation —- FFFFFF gives you white [white]
The notation —- 000000 gives you black
You get any shade of grey by using all of the same number —
ie. AAAAAA is a light grey [light grey] and
333333 is a dark grey
Usually using the higher numbers will give you a lighter version of the color you want except for pure colors, in which case you want to use 0’s for the other colors in the set. Thus
FF0000 is bright red
00FF00 is bright green
0000FF is bright blue
To get intermediary colors you use
FFFF00 for bright yellow [bright yellow] and
00FFFF for blue green
For a light shade of red [light red] you can use ie. FFCCCC
And for a dark shade of red you can use ie. FF3333
To get pure purple you would use something like: FF00FF
Orange is a little diceier since you have to deal with the two codes that govern red and green. Since pure yellow is FFFF00, you would want to place more emphasis on the red portion of that code to get varying shades of orange —– ie. FF9900 (or something like that)
AND you don’t have to make both members of the three pairs in each set the same. You can get varying shades of your color by making them different. Play around with it in a graphics program. Most graphics programs will give you both the RGB numbers and hexadecimal numbers for your color. Play where you see the little squares of a color you are working with by changing either the RGB code or the hex code or by clicking on a color wheel which should change the color in the little square and then read the color code next to it.
After that you can play around and use various mixtures to get the color you want. There are lots of color charts which give you specific colors.
_________________
Lionmom100 "
comments (5) 
