Search This Blog

Monday, September 17, 2007

Change blog background color and others

With New Blogger, it is very easy to change colors of various thing, and that include the blog background color. All you need to do is to sign into blogger.com (Dashboard) where you will see a list of all the blogs you have in your Blogger account. Click on LAYOUT for the relevant blog, then click on the "Fonts and colors" New Blogger fonts and colors sub-tab sub tab. You will then see a page to change the colors of various things as seen in the screenshot below:

New Blogger change fonts and colors options

The first choice is to "Change Page Background Color" and that has already been selected for you. You can select the color you want by one of the boxes that contain "Colors from your blot", "Colors that match your blog" or "More colors". If non of the colors given there is what you want, you can get a wide range of color by typing in the hexadecimal color code (highlighted by a red ellipse) of the color you want. For this purpose, I normally uses ColorPic or Color Blender, the use of which have been described in these posts:

Blending the colors of your ads to the colors of your website and

Blending the color of your search box to the colors of your website.

After you have made a selection, click "Save changes".

You can see from the scroll box in the left section that there are other things whose color and font you can change.

68 comments:

  1. I have a question maybe you can help me with. I really love the LINKS TO THIS POST "Backlink" feature. Not only to link to external pages, but also to other pages on my blog.

    For example, page

    http://noiroftheweek.blogspot.com/2006/11/alias-nick-beal-1949.html

    shows a link to the Blue Dahlia page

    http://noiroftheweek.blogspot.com/2006/12/blue-dahlia-1946.html

    at the bottom.

    My question is that not all links show up. I link
    http://noiroftheweek.blogspot.com/2007/09/chinatown-1974.html

    Chinatown with

    http://noiroftheweek.blogspot.com/2007/09/maltese-falcon-1941.html

    the Maltese Falcon, however the backward link doesn't show up on the Chinatown page.

    Is there a way to get Google to find those links?

    ReplyDelete
  2. Hi Steve,

    To tell you the truth, I have never bothered with the backlinks, until now. I have one post What is URL and how to get it which I myself have linked extensively in my own posts whenever URL is mentioned, but after I enabled backlinks to test and saved the setting, I checked that post and saw only 4 backlinks, of which 3 are posts from my own blogs (using a different Blogger account). There must be many others because URL is mentioned in many posts of mine, but I don't see them.

    I will try to dig for some information and see if I can throw further light on this matter.

    Peter (Blog*Star)
    The easiest way to earn something for your blogging efforts

    ReplyDelete
  3. Hi Steve,

    Forgot one thing, the backlinks have nothing to do with Google, only Blogger. This problem can only be explained or solved by Blogger, not Google.

    Peter (Blog*Star)
    Natural Remedies

    ReplyDelete
  4. Page Background Color is not an option for me, and has never been, for any of the layouts I've used. It doesn't appear in the list.

    Am I just stuck with the default color from the template I chose?

    ReplyDelete
  5. Hi Scott,

    I thought this post gives instruction on how to change blog background color? I don't understand your problem.

    Peter (Blog*Star)
    Testing Blogger Beta (now New Blogger)

    ReplyDelete
  6. Peter,

    Can you help? I have noticed that comments made on my site aren't visible on the site b/c my site has a black background and the comments font color is black. I can't find in the layout how to change the comments font color to white. Can you help? My blog is 80sRockVideos.com.

    Thanks,

    J. Anthony

    ReplyDelete
  7. Hi Anthony,

    What template are you using?

    I did 2 tests. One failed and one only succeeded in changing the "COMMENTS" title. See Change comment font color.

    If I have the time, will try further tests.

    Peter (Blog*Star)
    Testing Blogger Beta (now New Blogger)

    ReplyDelete
  8. Peter,

    Thanks for getting back so quickly. I am currently using the Sand Dollar template. You can see from the comment you left me here, the links show up, but the regular text does not...

    Any help is greatly appreciated.

    J. Anthony.

    ReplyDelete
  9. Hi Antony,

    Sand Dollar default color is orange so you must have changed the background color. While I have not used it, it looks like you are using a stretched version of Sand Dollar.

    Will try to look into this later. Hopefully I don't forget.

    Peter (Blog*Star)
    The easiest way to earn something for your blogging efforts

    ReplyDelete
  10. Scott mentioned a problem that I have; you have indicated how to change the background colour if that option is available to use under the "Fonts and Colours" list. In the "rounders" template that I'm using (for example), the first choice in the list is "Main Background Colour" and there is nothing for "Page Background Colour"

    ReplyDelete
  11. Hi,

    I am trying to change the background color of my blog.
    When I go to "Layout" -> "Fonts and Colours" it has only settings to change the "main background colour" which is the text area but I want to change the main body background (the whole page's colour). Any ideas how I can do that?
    I tried to check the html code but I think there is a defaut java script for body background which I do not know how to alter.

    Thanks a lot :)

    ReplyDelete
  12. Hi Marianna,

    See Test blog background color. Isn't that what you want?

    Peter Blog*Star
    Blogger FAQ (Frequently Asked Questions_
    (Blogger FAQ in progress. More will be added as I have the time)

    ReplyDelete
  13. hi there! um, what if I am using free templates like the one that I use for my blog - http://f-2-d.blogspot.com? I can't edit the font style/ colour/ whatever... And I can't even change the default language created by the designer. I wish to change it to english 100%. Just take a look please..

    ReplyDelete
  14. Can someone tell me how I can change the background color of just one post? Is it possible? I tried to put in the html code in the post html editor but got and error message saying it was invalid.

    ReplyDelete
  15. Hi, im trying to REMOVE the Color from the main background, how can i do this?
    i have this on the template:

    Variable name="mainBgColor" description="Main Background Color"
    type="color" default="#ffffff" value="#e2f0ff"

    The thing is that i want to use an image instead of a color, and when i put the image, the color comes right in top of it.

    ReplyDelete
  16. Hi Ozyel,

    I haven't tried this myself, but perhaps you can try deleting the part in the template that gives it the color then add the background picture. Make sure you backup template and backup Page Elements before you tamper with the template.

    Peter Blog*Star
    Alternatives to Google AdSense

    ReplyDelete
  17. Dear Peter,
    When i go to setting, fonts and colours, there is just no way that it lets me change the colour of my labels list as a page element on right. Impossible, regardless of the colour i chose.
    Yet, if you click on one of those links (lables list on the right), on the new page the very same list appers with the same colour, the
    colour which indeed i set in "fonts and colours" setting.
    Equally, at bottom page i have some links, all of a colour i never
    set...
    Same applies to "comments" on the bottom of each photo i upload.

    There must be a way to set colours from the html template, but i would
    not know how...

    thanks so much for looking into this!
    Matteo.

    ReplyDelete
  18. I have not thoroughly checked this out, but since the labels in the label list are hyperlinks (links), they will take the color of links - 3 color
    1. unvisited link
    2. visited link
    3 hover over link

    and if you want to change the color of the labels of the link, you will have to change
    ===============
    <Variable name="linkcolor" description="Link Color"
    type="color" default="#58a" value="#5588aa">


    <Variable name="visitedlinkcolor" description="Visited Link Color"
    type="color" default="#999" value="#999999">

    =======================

    or

    =======================

    a:link {
    color:$linkcolor;
    text-decoration:none;
    }
    a:visited {
    color:$visitedlinkcolor;
    text-decoration:none;
    }
    a:hover {
    color:$titlecolor;
    text-decoration:underline;
    }
    a img {
    border-width:0;
    }

    ===================
    but note that links in the whole blog will also be changed.

    ReplyDelete
  19. Peter, thanks a lot. I found in the html the part you indicated; but now, where do i insert che colours code? how can i modify the html so to insert the colours code, or any other instruction so to change colours?
    Thanks so much.
    Matte

    ReplyDelete
  20. Example:

    a:link {
    color:red;

    or
    a:link {
    color:#5588AA;

    Refer to HTML color codes

    BUT I hope you understood my last comment - ALL links will change color.

    ReplyDelete
  21. Hi, I have a question I hope you can help me with. I changed the background on my blog and when I did it made all the links change color-- they are suppose to be gray and brown but they defaulted to blue and purple. When I change them in the Fonts and Colors section it doesn't help. I think I might have messed up my html -- how do I manually change the link colors since the Fonts and Colors section isn't doing it? My blog is www.womeninthescriptures.blogspot.com so you can see what I am talking about

    ReplyDelete
  22. <Variable name="linkcolor" description="Link Color"
    type="color" default="#58a" value="#5588aa">

    <Variable name="visitedlinkcolor" description="Visited Link Color"
    type="color" default="#999" value="#999999">

    a:link {
    color:$linkcolor;
    text-decoration:none;
    }
    a:visited {
    color:$visitedlinkcolor;
    text-decoration:none;
    }
    a:hover {
    color:$titlecolor;
    text-decoration:underline

    ReplyDelete
  23. I changed the html to read exactly like you posted, but it didn't help. They are still the wrong color. Any other ideas?

    ReplyDelete
  24. My earlier comments gave the codes which control the link color. You will have to change the HTML color code in the template. Regarding HTML color code, you may also want to consider ColorPic.

    Note: I have not looked at your problem in detail, but if you have done the right thing and still see no change, you could be looking at a cached copy of your blog. Refer to What to do when you cannot see new post

    ReplyDelete
  25. It is better if i can change the blackground to other photos or picture? do you know that???

    ReplyDelete
  26. Hi Peter

    I'm trying to change my page background color from black to white, but it'll never change. I did it using the blogger interface (like you explain here) and also changing the html code. They both TELL me that my page background color is white, but IN FACT it's still black.

    Could you please help me?

    Here's my blog:
    http://atelierpiratininga.blogspot.com/

    And that's my code:
    body {
    background:$bgcolor;
    background-color:#ffffff;
    margin:0;
    color:$textcolor;
    font:x-small Georgia Serif;
    font-size/* */:/**/small;
    font-size: /**/small;
    text-align: center;
    }

    ReplyDelete
  27. Oh, I forgot - here's my css:

    Variable name="bgcolor" description="Page Background Color"
    type="color" default="#fff" value="#ffffff"


    thanks a lot!

    ReplyDelete
  28. Where did you get that template?

    ReplyDelete
  29. It's the Minima:

    -----------------------------------------------
    Blogger Template Style
    Name: Minima
    Designer: Douglas Bowman
    URL: www.stopdesign.com
    Date: 26 Feb 2004
    Updated by: Blogger Team
    ----------------------------------------------- */

    /* Variable definitions
    ====================
    Variable name="bgcolor" description="Page Background Color"
    type="color" default="#fff" value="#ffffff"


    Should I give you the complete code to figure what's going on?

    I really dont have a clue... I'd love if tou could help me...

    ReplyDelete
  30. Is your blog using Minima or Minima Dark? Did you get the template direct from Blogger or a third party?

    ReplyDelete
  31. Hi Peter!
    My template is Minima and I got it direct from blogger. I was using minima dark before, but I've already changed to Minima (first thing I did trying to solve this problem). But, as you can see, my page background color is still black. That's why I'm asking for help.

    ReplyDelete
  32. When you change to Minima template (white background), the blog background should change to white. I am not sure what exactly you did but why don't you try to reload your template or follow the steps here to change the background color as well as others to keep the text readable etc.

    ReplyDelete
  33. really useful advice, after reading it I thought of the color code in my photoshop and I altered it there,was so easy
    kudos

    ReplyDelete
  34. HELP!!! I am a blog virgin and have no idea what I am doing, but have many ideas about what I would like to do...I hope that you can help me. Here is what I want to do:
    1. Scan an image into Photoshop, doctor it up a bit and then make it the background for my blog. I have adsense and several widgets that I DO NOT want to lose. Can this be done?

    2. Right now, I have 2 colums-a small one to the left and a large one in the center/right-is it possible to get a 3 or 4 colum display??

    3. I am hosting a contest and would like to make a box in the center of my blog at the top to schowcase this contest. The contest info needs to ALWAYS be displayed even when I add a new post. I know that it can be done because I have seen it on several sites.

    If you look at my blog you will see the background that I am currently using.

    Any assistance that you can provide would be GREATLY appreciated...

    Marquita Stewart
    http://marquitastewart.blogspot.com

    PS. I am TRULY a dummy...so, PLEASE, make this as simple as possible and PLEASE email it to me. Please dumb it down to a preschool level.
    marquita.stewart_tobm@yahoo.com

    ReplyDelete
  35. "1. Scan an image into Photoshop, doctor it up a bit and then make it the background for my blog."

    Refer to graphic background for blog

    "2. Right now, I have 2 colums-a small one to the left and a large one in the center/right-is it possible to get a 3 or 4 colum display??"

    Use ready-made 3 column Minima template (3 column template FAQ or better 4 column Minima template.

    "I have adsense and several widgets that I DO NOT want to lose. Can this be done?"

    Backup gadgets and backup template before you do anything with your template.

    "3. I am hosting a contest and would like to make a box in the center of my blog at the top to schowcase this contest."

    Edit your template to get extra "Add a gadget". If you use my 4 column Minima template, that would already have been done.

    ReplyDelete
  36. Peter...

    Thanks for the HELP...but...now that I have added the new gadget at the top of my blog....how do I add my contest post to it??

    It has a picture and text and I would like for people to be able to click the box to see the current contest.

    Thanks...
    Marquita Stewart USA

    ReplyDelete
  37. Add a HTML/Javascript gadget. Use <img&ht; to display your image combined with making the image a hyperlink.

    The last link (post) is not specifically in answer to your question but if understood, will show you what to do. If you don't understand, comment again and I will do a post specifically to show how to make an image a hyperlink.

    ReplyDelete
  38. I have a WP Premium Red template installed and up and running but I cannot change the color. Is there a specific reason this is so? Or is there a special way to do this?

    ReplyDelete
  39. I have new question about labels...but could not figure out where to enter it under your "Labels" label...but could not figure out where...

    On my blog http://marquitastewart.blogspot.com I have my labels displayed as "Search By Topic." The topics are a list of my labels. Under "Quita Fights the Funk" I have 3 posts. When I go into edit my posts, I have 3 posts with that label but when I select that label going through "Search by topic" It only shows my most recent post. NOt the other two posts. When I "search by (other)topic(s)," It shows all of the posts with that label in chronological order.

    Any idea why this label will only show 1 post even though it shows there are three posts? I have checked the labels on the other two posts and they are exactly the same as the one that is correct.

    HELP!!!

    ReplyDelete
  40. hello um for me i have the tabs posting settings template AND monetize and under templates i only have the sub tabs of edit html pick new and customize and none of them lead me to fonts nad colors where do i go?

    ReplyDelete
  41. changing of fonts and colors is not working! please help! there are no colors nor words appear on the box on the side where you can choose your preferred color. help!

    ReplyDelete
  42. Perhaps it is the template you are using?

    ReplyDelete
  43. pls i have a question i need you to help me with. i started using a new background from bestblogontheblog but now i want to change return to my default blogger background(the one with the template i use)..i have tried severally so i know there's something i'm not doing right..pls help!!

    ReplyDelete
  44. Describe how you first added your background and also how you added the new background from baestblogontheblog

    ReplyDelete
  45. Hi. I can't keep my font consistent throughout my posts. Is this because I cut and paste from a document? I also have trouble recently with some of the font changing colors, even though I've done nothing to those particular words. It seems like something new goes wrong with just about every new post.

    Thanks for your help.

    ReplyDelete
  46. YES,THAT'S IT!!! Thank you so, so much, Peter. Great blog, by the way. With all of this wonderful information, I think you are my new favorite!

    ReplyDelete
  47. Hi,I really like the feature in the article. But when I went to "fonts" there is a blank window opening. I also want to change the blog post font to dark black, as my present font is light. My website is www.techlikes.com..Please check.

    ReplyDelete
  48. Hi,I really like the feature in the article. But when I went to "fonts" there is a blank window opening. I also want to change the blog post font to dark black, as my present font is light. My website is www.techlikes.com..Please check.

    ReplyDelete
  49. What template are you using?

    ReplyDelete
  50. My present blogger template is "Arthemia theme by Michael Jubel | Converted by Blogger for Wordpress to Blogger sponsored by Cinta".. I found it on the net.

    ReplyDelete
  51. I'm a new blogger... I already know a bit about url coding... I don't like the bland layouts on blogspot, and I'd like to make my layout totally unique. I've tried entering codes into the 'Edit Layout' pane, but I'm getting nowhere-- the site won't accept any of my codes! I get annoying red letters at the top of the page instead. D: Can you help me?

    ReplyDelete
  52. Graphic background to blog! Thx for the helpful link. :)

    ReplyDelete
  53. I have a custom template that I've created using the Advanced settings in the Blogger Template Designer. However, I can't seem to find a place to change either the background or font color for comments. The font color seems to be the same as my posts' font color, but I don't know where it's getting the background color from. And they're a very similar color, which makes the comments very hard to read. Any thoughts?

    ReplyDelete
  54. I have 2 questions!

    I'm having problems with linking on my Blogspot blog. I just started.

    To be more specific, I have a post on identifying fake Nokia phones. There, I mentioned Nokia C2-00 which I felt should have a link to its own page, but I didn't have an article on Nokia C2-00 yet. So, if later, I put together an article on Nokia C2-00, how do I now provide link to the Nokia C2-00 word which was mentioned in the old article about identifying fake Nokia phones without having to republish the old article?

    When I experimented by puting up an article on Nokia C2-00 and trying to provide a link to the Nokia C2-00 word mentioned in a previous article, I was forced to republish the previous post for the change to be reflected.

    Secondly, I write with font style Calibri, size 12. I found out that in some occasions, some words are not of size 12 after posting, they seem smaller. What do I do about this?

    Thank you.

    ReplyDelete
  55. You first have to know what is what is URL and how to get it then how to make active link in posts and comments. So after making the new post, you go edit the old post and make Nokia C2-00 and active link

    ReplyDelete
  56. Thanks, Peter, so much from the bottom of my heart.

    ReplyDelete
  57. I got a quick question,
    When I am editing a page, how I get the numbers to stop being flowers?

    ReplyDelete
  58. Did you know that the Basic HTML Color set is a combination of 216 color? Here, you can find a tabulated view of the basic HTML colors here. It can be handy when you need to quickly choose a standard HTML color for your site or any other project.HTML color codes can set the color of web site background, color of text, cells in tables and much more.

    ReplyDelete
  59. so funny i cannot change background color on my blog, tried everything but it just doesn't work. i'm totally puzzled

    ReplyDelete
  60. i want to change my blogger title(not post title) colour.although i am using a specified premier template,still i can change the title colour via edit html? my blog is-http://work8pc.blogspot.in/

    ReplyDelete
  61. Its nice as u explained but in mine blog such codes are not found..
    so How do I do it.. plz check mine once suggest me to change in
    http://www.arabie3lan.com الشيخ الروحاني
    which part so that i can obtain as you explained here.

    ReplyDelete

Related Posts Plugin for WordPress, Blogger...

Find topics by using the Google custom search box above which can search multiple blogs, or the SEARCH BLOG in the left corner of navbar. You can also find topics in the Label List and Categrories in the right sidebar.

For more information and special deals related to any of the issues on this page, place your cursor over the double-underlined links. All information supplied by Kontera.com.

Disclaimer: This blog has no relation with Wiley Publications