Friday, April 11, 2008

How to change the color of the trim

Part 2 (Optional) : Change the color of the trim on your blog ~ to match your new wallpaper.

I didn't like the brown trim that framed my blog ( since I now have green wallpaper on my ciderantiques blog) so I changed the brown trim to green. In html it is called the outer-wrapper and found under layout.

If you want a new colour, you need to change the code of the colour (called a hex-code because it has six digits). eg. The taupe trim on my ciderantiques blog is known as colour d2b48c.

Here are some codes:

pretty coral pink ~ ff9999

Pale pink ~ ffcccc

Antique White ~ ffefdb

Cream ~ ffffcc

Bisque ~ cdb79e

Seashell Pink ~ fff5ee

Taupe ~ d2b48c

Linen ~ faf0e6

greeny taupe ~ 999966

wood (brown) ~ cdaa7d

Old Lace ~ fdf5e6

To view over 200 color options you can google search for Hex Code colours. A good site is:

You do not have to upload this information. They are universal codes.

If you want to change your trim, look under the layout ~ Outer Wrapper (trim) and replace the existing hex codes. (I highlighted what you are looking for in green). It looked like this in my blogger template:

/* Layout----------------------------------------------- */#outer-wrapper

{ background-color:#8E9D69;

border-$startSide:1px solid #8E9D69;

border-$endSide:1px solid #8E9D69;

width:700px; margin:0px auto; padding:8px; text-align:center; font: $bodyFont;


Delete the existing 6 digit number and replace it (three times) with the desired new colour number you have chosen. Click preview to see how it looks and save when done (or clear edits to try something else).

Have fun with it! :-)

5 comments:

Mya said...

Thanks for all the info but I'm too scared to change my wallpaper. I think I can just changs the trim but I didn't see the spot in layout to do that. I am a little technically challenged. Can you give me a little more direction. What I really want is to widen my format and change my brown trim to pink. That shouldn't be hard, right? Easy for you to say. I need help.
Thanks,
-Mya

Karen said...

Hi Mya! I will send you an email. We can do it :)

~ Karen

Diana said...

Thank you sooooooo very much for the info. It has been very valuble. Come take a look at what I've done with your help!

Diana

A M A N D A said...

I just want to say thank you so much for creating this helpful blog. You are wonderful and your clear information helped me a lot. Regards, Amanda

Trash 2 Treasure said...

Thanks for the great tuitorial.....I'm gonna attempt it....I hope it works for me....