Blogspot 101 - Background Color
by revka ~ February 19th, 2008. Filed under: Blogger Tutorials.*To view all of the posts in this series, either click on the following link, or type Blogger Tutorials into our search box.*
I think it’s high time I added another tutorial to my series Blogspot 101.
The border tutorial was a big hit, and I am happy to have been able to help you spruce up your design. I have had many requests for a tutorial detailing how to create an image border. I will get to that eventually. That can be a complicated task requiring a lot of tweaking.
Several people have asked how they can have their background one color and their content area another. That is actually quite a simple task, and I will show you how to do that in this tutorial.
- From your dashboard (I’m assuming you’ve already logged into your blog), click on Layout.
- Click on Edit HTML.
- Scroll through the code until you see the section that begins with the word body.
- Under that line, look for a line that begins with “background:” (the word and the colon, not the quotation marks). If that line is not there, simply add it. Make sure to add the colon after the word background.
- To change your page’s background color, you will need to insert a color code, which is the pound sign (#) followed by a six digit/letter code. For this example, I will use, #000000. That is the code for black. (You can find web-safe color codes at Page Tutor or WebsiteTips.com. WebsiteTips.com also offers free color schemers and color palette tools.) After you type in the code, finish with a semicolon. Your line of code should look like this - background:#000000;
- Next, you need to change your content area background color. Scroll further down in the code until you find the section that begins with outer-wrapper.
- Follow steps 4 and 5, but change the color code to #ffffff. That is the code for white. Your line of code should look like this - background:#ffffff;
- Click on Preview. If you have done everything correctly, your page background should be black (or whatever color you specified), and your content area should be white (or other color).
- If everything is correct, click on Save Template.
Let me know if you need any assistance implementing this tutorial. Happy tweaking! *smile*

