How to change color of background

Discussion in 'HTML & Website Design' started by alex06295, Jan 3, 2012.

  1. #1
    I want to change color of background, not color of content back ground........ I want to change color of overall background which is both sides of the content......

    the site is e07.net

    please help

    thanks
     
    alex06295, Jan 3, 2012 IP
  2. Inna

    Inna Peon

    Messages:
    16
    Likes Received:
    1
    Best Answers:
    1
    Trophy Points:
    0
    #2
    Sorry, don't understand the question. Now there is the image in your site background http://e07.net/wp-content/themes/john-loan-pro/images/Business.jpg
    Do you want to change this image?
     
    Inna, Jan 3, 2012 IP
  3. alex06295

    alex06295 Well-Known Member

    Messages:
    944
    Likes Received:
    15
    Best Answers:
    0
    Trophy Points:
    130
    #3
    yes, it is in both side
     
    alex06295, Jan 3, 2012 IP
  4. mmslax2

    mmslax2 Active Member

    Messages:
    235
    Likes Received:
    2
    Best Answers:
    1
    Trophy Points:
    63
    #4
    Because your background and container are images you won't be able to change their colors in CSS. In order to change the color you'd have to get the .PSD and go into Photoshop, change the color, resave as the new .jpg and finally re-upload it back to your webhosting
     
    mmslax2, Jan 3, 2012 IP
  5. Inna

    Inna Peon

    Messages:
    16
    Likes Received:
    1
    Best Answers:
    1
    Trophy Points:
    0
    #5
    I fully agree with mmslax2
    But, Alex, if you don't have the original psd-file, you can try to change the current jpg like this:
    1) Open current jpg in Photoshop and add new layer with opacity=50%
    2) Paint new layer using the Paint bucket tool
    3) Delete central part from new layer
    You can receive the quite acceptable background for the site.
     
    Inna, Jan 4, 2012 IP
  6. alex06295

    alex06295 Well-Known Member

    Messages:
    944
    Likes Received:
    15
    Best Answers:
    0
    Trophy Points:
    130
    #6
    what if I remove the image, which color would look at the placed of images in both side?
     
    alex06295, Jan 4, 2012 IP
  7. owais

    owais Member

    Messages:
    183
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    26
    #7
    Are you talking about content background?
     
    owais, Jan 4, 2012 IP
  8. alex06295

    alex06295 Well-Known Member

    Messages:
    944
    Likes Received:
    15
    Best Answers:
    0
    Trophy Points:
    130
    #8
    no, overall background, which is in both side if content, it has image....on the place of image, I need nothing, just white backgraund ....
     
    alex06295, Jan 4, 2012 IP
  9. owais

    owais Member

    Messages:
    183
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    26
    #9
    Ok
    First of all you in html style sheet have to remove image from the body. Now for center content area make new div new with center image which has been corp from photoshop add it in new div id.

    i can do it for you only for iTrader.
     
    owais, Jan 4, 2012 IP
  10. NothingLikeThis

    NothingLikeThis Member

    Messages:
    113
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    26
    #10
    when there is no background color visible at all then why are you worry about changing it ?remove the images and change background property from html
     
    NothingLikeThis, Jan 4, 2012 IP
  11. sanashekh

    sanashekh Greenhorn

    Messages:
    4
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    11
    #11
    Quick and dirty, here is how to change the background of your web page. Just use the bgcolor attribute in the <body> tag and you are golden.

    <body bgcolor="Silver">
    <p>We set the background...</p>
    </body>
     
    sanashekh, Jan 7, 2012 IP
  12. Inna

    Inna Peon

    Messages:
    16
    Likes Received:
    1
    Best Answers:
    1
    Trophy Points:
    0
    #12
    The current image includes both center and side backgrounds. After deleting it the central part with content will have white background as well as side parts.

    The easiest way, I think, - is to colour the current image sides in white and overwrite the old image. I can do the new image for 3 minutes, but I am not allowed to upload the pictures here yet. I can upload it to another place like google docs.
     

    Attached Files:

    Inna, Jan 7, 2012 IP
  13. Inna

    Inna Peon

    Messages:
    16
    Likes Received:
    1
    Best Answers:
    1
    Trophy Points:
    0
    #13
    Oh, somehow the image was attached to my previous post.
    If it fits you can upload it in the folder where the old image is. But MADE THE COPY of the old image beforehand. And notice that new image has no shade.
     
    Inna, Jan 7, 2012 IP
  14. sharmakamal

    sharmakamal Peon

    Messages:
    17
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #14
    Remove the image and by default the background color comes white if it not then use bg color property and give it white or FFFFFF for white color.
     
    sharmakamal, Jan 10, 2012 IP
  15. Inna

    Inna Peon

    Messages:
    16
    Likes Received:
    1
    Best Answers:
    1
    Trophy Points:
    0
    #15
    Guys, before advising anything in this thread, please read this:
    and this:
     
    Inna, Jan 10, 2012 IP
  16. jasmine lane

    jasmine lane Peon

    Messages:
    44
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #16
    Yes John is right i am agree with John.Please trying this code.
     
    jasmine lane, Jan 10, 2012 IP
  17. raja_reog

    raja_reog Greenhorn

    Messages:
    23
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    11
    #17
    you can edit css files on public directory wp-content/themes/john-loan-pro/style.css
    or you can edit from wp-admin panel left hand menu find editor menu

    find this code
    body {
    
        background: url("images/Business.jpg") no-repeat fixed center top transparent;
    
    
    
    }
    
    
    
    Code (markup):
    to create white color change to
     body {
    
        background: none;
    
    
    
    }
    
    
     
    Code (markup):
    or change like this if you want fill with other color
     body {
    
        background: #ccc;
    
    
    
    }
    
    
      
    Code (markup):
    input hex color code like #ccc to other for make other color

    then find the code like this at this css files too
    
    #wrapper { 	background: url(images/wap.png); 	padding: 0 20px; 	margin-top:0px; 	margin-bottom:20px; }
    Code (markup):
    change the background field with hex color code to for make fill color at content background. for example
     
    #wrapper { 	background: #222; 	padding: 0 20px; 	margin-top:0px; 	margin-bottom:20px; } 
    Code (markup):
    good luck and waiting for your report

    regards
     
    raja_reog, Jan 10, 2012 IP
  18. Toycel

    Toycel Peon

    Messages:
    243
    Likes Received:
    11
    Best Answers:
    4
    Trophy Points:
    0
    #18
    Would be the best bet as the content in the middle wants to stay on the gradient part of the page
     
    Toycel, Jan 10, 2012 IP
  19. alex06295

    alex06295 Well-Known Member

    Messages:
    944
    Likes Received:
    15
    Best Answers:
    0
    Trophy Points:
    130
    #19
    I changed according to your suggest, but I'm not seeing the changes......

     
    alex06295, Jan 11, 2012 IP
  20. raja_reog

    raja_reog Greenhorn

    Messages:
    23
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    11
    #20
    i don't see any change code at your css files, it's impossible to seeing change effect at your site..

    be carefully.. at your css have a lot of 'body' tag.. finding this line...
    
    /* Main global 'theme' and typographic styles */ body { 	background: url(images/Business.jpg) fixed; background-repeat:no-repeat; 	background-position:top center;  }
    Code (markup):
    then change like my post before!
    and be careful with wrapper tag too,

    finding this line
    
    /*main theme structure */ #access .menu-header, div.menu, #colophon, #hb, #main, #wrapper { 	margin: 0 auto; 	width: 724px; } #wrapper { 	background: url(images/wap.png); 	padding: 0 20px; 	margin-top:0px; 	margin-bottom:20px; }  /* footer area structure*/
    Code (markup):
    change at second #wrapper ID tag.
    i was try to change this by using firebug. it is work!

     
    raja_reog, Jan 12, 2012 IP