Body (Or Background) Color

The background color for your blog is not located with the other color changes in "Fonts and Colors". Oddly enough, to change the blog's background color requires going into the template--you'd think it would be among the other clickable changes. Some new bloggers may not like the idea of revising the template code, but eventually you will want something bad enough to dare! When the time comes for this change, look for a section resembling this below (from one of my other blogs):

[More below...]

body {
background:oldlace; url("http://www.blogblog.com/harbor/rocks.jpg") no-repeat right bottom;
background-attachment:fixed;
margin:0;
padding:0;
font:x-small Georgia, Serif;
color:$textcolor;
font-size/* */:/**/small;
font-size: /**/small;
}

or, similarly, this (from the code for this blog):

body {
background:#123;
margin:0;
text-align:center;
line-height: 1.5em;
font: x-small Trebuchet MS, Verdana, Arial, Sans-serif;
color:$mainTextColor;
font-size/* */:/**/small;
font-size: /**/small;
}

It's the "body" where you want to make the change or else create the color. Find or alter the color statement--whether you use a number or name doesn't matter. If you have to add the "background: color;", just be sure it's inside the brackets like you see in the two examples above.

See also my post about Fonts And Colors

END.

Change Color, Font, And Size of Text

When you select "Fonts and Colors" on the Layout page, "Text color" is the first in the vertical list, but "text font" is further down (sixth on my list); if you click on that link, a list of fonts (not previously showing) should appear in place of the color boxes out to the right. Furthest to the right are boxes to check for Smaller, Larger, Bold, and Italic. If you still aren't seeing what you expect, never underestimate the value of "clearing the cache and cookies" to update your screen.

Change Color And Font

Steps 1--10 to change a font or color in New Blogger

1. go to the Dashboard 2. click on the Page Elements tab. 3. look up above and click on Fonts And Colors. You'll see a list. 4. on the left side click on which area you want to change color. 5. on the right side click the correct color for that text area. 6. on the left side you may have to scroll down for the font list. 7. then on the left click on which area you want to change text in. 8. on the right side click on the font, size, bold, italics you want. 9. in 4-7 above you can see the changes in the small view window at the bottom of the screen. Sometimes it has a glitch and won't show, but you can make the changes anyway if you are confident of yourself. You will see the change (or not) when you return to View Blog. If you're not confident, try again later. 10. be sure to Save Changes before you exit.

Things you can change in the list include:

Text Color
Blog Title Color
Post Title Color
Sidebar Title Color
Date Header Color
Text Font
Blog Title Font
Blog Description Font
Sidebar Title Font
Date Header Font

Some detail about Text Fonts:

Text color is the first in the vertical list, but "text font" is sixth; if you click that link, a list of fonts (not previously showing) should appear in place of the color boxes out to the right. Furthest to the right are boxes to check for Smaller, Larger, Bold, and Italic. If you still aren't seeing what you expect, never underestimate the value of "clearing the cache and cookies".

Body (or background) Color

Oddly enough, to change the blog's background color requires going into the template. See if you find a section resembling this from one of my blogs:

body {
background:oldlace; url("xxxhttp://www.blogblog.com/harbor/rocks.jpg") no-repeat right bottom;
background-attachment:fixed;
margin:0;
padding:0;
font:x-small Georgia, Serif;
color:$textcolor;
font-size/* */:/**/small;
font-size: /**/small;
}

or, similarly, this is the code for this blog:

body {
background:#123;
margin:0;
text-align:center;
line-height: 1.5em;
font: x-small Trebuchet MS, Verdana, Arial, Sans-serif;
color:$mainTextColor;
font-size/* */:/**/small;
font-size: /**/small;
}

It's the "body" where you want to make the change or else create the color. Find or alter the color statement--whether you use a number or name doesn't matter. If you have to add the "background: color;", just be sure it's inside the brackets like you see in the two examples above.

END.

Background Color Of A Post

Classic Blogger:

In your template, just before the closing tag </style> occurs, place the couple of lines below (which you can change to your colors or fonts). This will just be an example you can start with as a test. This paragraph demonstrates what the code below causes.

#birdlist {margin:0px;padding:0px;background:navy;color:lightblue;font: 1.1em "Times New Roman","Trebuchet MS",Trebuchet,Verdana,Sans-Serif; font-weight:none; }
</style>

After that is established in the template, any time that in your post you place <p id=birdlist> at the beginning and </p> at the end of that text, you will create the font color and background color that you want. You might change navy to white and lightblue to black, depending on what you want. If you don't invoke the paragraph id in your post, it will just write in black over your current background (if any).

Don't be tripped up by the list of fonts; the computers in the world will choose the first one they come to that they possess. So if you choose a really new and esoteric font, you may be the only reader who sees it in just that font. But they will see it in the second, third, or fourth font listed.

New Blogger

The main difference here is that you don't make the addition in the same place. When you open the template, you need to search for the Style items that you know, though they are not called that! Search for "Body" and other style (CSS) listings that you might already be familiar with. You might see something like this: body { background:oldlace; url("http://www.blogblog.com/harbor/rocks.jpg") no-repeat right bottom; background-attachment:fixed; margin:0; padding:0; font:x-small Georgia, Serif; color:$textcolor; font-size/* */:/**/small; font-size: /**/small; } Put the additional (birdlist) lines after the above, but BEFORE the closing } bracket. There are other places that would be correct, and I'm just pointing out one. This #ID is not limited to paragraphs; it could also be applied to a <div>, etc.

THE END.

Change Navbar Color in Beta

Not Rocket Science
1. Go to your Dashboard. 2. Click on Layout. 3. Below where it says Add and Arrange Page Elements, 4. There's a blue bar with "Navbar" on it. 5. Click "Edit" out to the far right and it will offer color choices.

END.