WordPress.org

Ready to get started?Download WordPress

Forums

Customizr
[resolved] [closed] Background colour (31 posts)

  1. hyldahl82
    Member
    Posted 1 year ago #

    How would I go about changeing the grey-ish background behind the slides?

    I'm looking to change it to white

  2. Andrew
    Forum Moderator
    Posted 1 year ago #

    Not sure I see the grey background, where is it?

  3. aliyarose
    Member
    Posted 1 year ago #

    yes I would love to know this too!

  4. NightmareSystem
    Member
    Posted 1 year ago #

    I'm looking to put this theme on my website and I would like put another color or img on the background, I would love to know this too!

  5. rdellconsulting
    Member
    Posted 1 year ago #

    You need to add this CSS to either Custom CSS or Child Theme:

    body {
      background: none repeat scroll 0 0 #FAFAFA;
      color: #5A5A5A;
      padding-bottom: 0;
    }

    Change #FAFAFA to background color you want
    Change #5A5A5A to text color you want

    You can also use an image as background:

    background: url('/wp-content/uploads/NAMEOFFILE.png') repeat fixed 0 0 #FAFAFA !important ;

  6. hyldahl82
    Member
    Posted 1 year ago #

    Thank you sir! :)

    What about the background colour of the circular images - The 3 links on the front page (not sure what to call them), they also have that colour

  7. TerdiaGuru
    Member
    Posted 1 year ago #

    Not sure what you mean but to change your menu or link color, simply use the firebug tool to inspect the page, this will enable you see the current css attribute for the menu link. You can then follow the step you use to change the body color to change your links

  8. rdellconsulting
    Member
    Posted 1 year ago #

    @hyldahl82, remember that the circles are meant to have a 270 x 250 Featured Image behind them.

    I achieved what you asked by editing that Image using Photoshop Elements.

    Then the links can be changed with:

    .widget-front h2 {
    color:red;
    }

    changing red to what you want.

  9. hyldahl82
    Member
    Posted 1 year ago #

    Just so that we're talking about the same thing.

    It's this background colour

    It has the same #FAFAFA colour as the standard background colour

  10. rdellconsulting
    Member
    Posted 1 year ago #

    That's the same I'm talking about.

    The CSS is:

    .round-div {
      border: 104px solid #E0FFC1;
    }

    Change #E0FFC1 to what you want.

  11. NightmareSystem
    Member
    Posted 1 year ago #

    hellow again, I tried this code

    body {
    background: url('wp-content/uploads/2013/08/fondo.png') repeat fixed 0 0 #FAFAFA !important ;
    color: #5A5A5A;
    padding-bottom: 0;
    }

    but do not work , the background is the same and the img doesn't appears

  12. Andrew
    Forum Moderator
    Posted 1 year ago #

    For everyone who's having an issue apart from hyldahl82 please create your own threads to discuss your own issues.

    The solution was already given to hyldahl82 regarding the background. If that solution didn't work for you then you are not experiencing the same issue.

    General rule: Don't post in someone else's thread unless you are contributing towards their solution.

  13. hyldahl82
    Member
    Posted 1 year ago #

    That's the same I'm talking about.

    The CSS is:
    .round-div {
    border: 104px solid #E0FFC1;
    }
    Change #E0FFC1 to what you want.

    I must underline the fact that I'm new to this...

    Anyway, I've already added the code for the backgrpund colour, which worked fine.

    Do I add the above code, underneath the code that I've added for the background in the custom css box?

  14. rdellconsulting
    Member
    Posted 1 year ago #

    That's correct.

  15. hyldahl82
    Member
    Posted 1 year ago #

    body {
      background: none repeat scroll 0 0 #FFFFFF;
      color: #5A5A5A;
      padding-bottom: 0;
    }
    Change #FAFAFA to background color you want
    Change #5A5A5A to text color you want
    You can also use an image as background:
    background: url('/wp-content/uploads/NAMEOFFILE.png') repeat fixed 0 0 #FAFAFA !important ;
    .round-div {
    border: 104px solid #ffffff;
    }

    Done that, but nothing happens. The background yes, but the background behind the circles is still the same...

    I've posted both codes and this is also the way I've added them in the custom css box ...could something be wrong there maybe?

  16. ElectricFeet
    Member
    Posted 1 year ago #

    Unfortunately, it won't work in Custom CSS, because the quote characters are forbidden in there. You will need to make a child theme (don't worry, it's easy).

  17. aliyarose
    Member
    Posted 1 year ago #

    hi! i successfully changed the body background color and the "background color" behind the featured pages circles, but now, when you mouse over the featured image circles the expanded version of the image "bumps into " the right side, so they're not full circles. it's as if the code below (which i gleaned from above) moved the featured image circles slightly to the right.

    /* Get rid of navbar/menu background */
    .navbar .navbar-inner {
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    background:none;
    }

    body {
    background: none repeat scroll 0 0 #FFFFFF;
    color: #000000;
    padding-bottom: 0;
    }
    .round-div {
    border: 104px solid #FFFFFF;
    }

    anyone have a solution?
    thanks!
    aliya
    powersuits.org

  18. hyldahl82
    Member
    Posted 1 year ago #

    @ElectricFeet

    Is this how the child them should look like then?

    /*
    Theme Name: My Child Theme
    Theme URI: http: //mysite.com/
    Description: This is a custom child theme I have created.
    Author: My Name
    Author URI: http: //mysite.com/
    Template: customizr
    Version: 0.1
    */
    
    body {
      background: none repeat scroll 0 0 #FFFFFF;
      color: #5A5A5A;
      padding-bottom: 0;
    }
    Change #FAFAFA to background color you want
    Change #5A5A5A to text color you want
    You can also use an image as background:
    background: url('/wp-content/uploads/NAMEOFFILE.png') repeat fixed 0 0 #FAFAFA !important ;
    .round-div {
    border: 104px solid #ffffff;
    }
  19. Andrew
    Forum Moderator
    Posted 1 year ago #

    @aliyarose, Please create/ continue your own thread regarding support for your own issue.

  20. ElectricFeet
    Member
    Posted 1 year ago #

    @hyldahl82: No, you've mixed in the instructions with the styles. You're also missing the line to import the rest of the Customizr styles, which is fundamental:
    @import url("../customizr/style.css");

    The file should look more like this:

    /*
    Theme Name: My Child Theme
    Theme URI: http: //mysite.com/
    Description: This is a custom child theme I have created.
    Author: My Name
    Author URI: http: //mysite.com/
    Template: customizr
    Version: 0.1
    */
    
    @import url("../customizr/style.css");
    
    body {
      background: white;
    }
    .round-div {
      border: 104px solid white;
    }

    ...changing white to be red, green, whatever, or another colour in the hex format #654321.

    However, if these are the only changes you are making to the theme, then you don't need a child theme. You can simply paste:

    body {
      background: white;
    }
    .round-div {
      border: 104px solid white;
    }

    in the Custom CSS panel of Customiz'it!

  21. hyldahl82
    Member
    Posted 1 year ago #

    The background is an actual image right?

    Which file "represents" the style of the front page?

    Right clicking with chrome I get...

    <img data-src="holder.js/270x250" alt="270x250" style="width: 270px; height: 250px;" src="data:image/png;base64,iVBORw0KGg...

    If yes, maybe it would be more "convenient" for me - with the lack of experience I have - to just replace that file with a "white" background image.

  22. ElectricFeet
    Member
    Posted 1 year ago #

    The background is an actual image right?

    Which background? The body background is the background of the whole page. The "background" of the circles around the featured images is actually a---rounded---border around the featured images.

    The "round" images (which are 250x270) are added as featured images inside the page you want to feature.

    Does that explain it better?

    Which file "represents" the style of the front page?

    Many files, together with information from your WordPress database.

  23. RustyWood
    Member
    Posted 1 year ago #

    @aliyarose

    Did you find an answer to this problem?

    The featured pages circles, but now, when you mouse over the featured image circles the expanded version of the image "bumps into " the right side, so they're not full circles.

    I'm having the same problem when I reduce the size of the browser window, after following the instructions on this thread and using:

    body {
      background: none repeat scroll 0 0 #FAFAFA;
      color: #5A5A5A;
      padding-bottom: 0;
    }

    and

    .round-div {
      border: 104px solid #E8E4E3;
    }

    On rollover the right hand side of the feature circle has a straight line although it is still centered !

    Thanks

  24. idacy santana
    Member
    Posted 11 months ago #

    tema customizr onde pode escrever codigo css?

  25. ElectricFeet
    Member
    Posted 11 months ago #

    @idacy santana in the Custom CSS panel of Customiz'it!

  26. idacy santana
    Member
    Posted 11 months ago #

    HELLO ELECTRICFEET

    how do to change these place names
    administration
    Logout
    posts RSS
    Comments RSS
    WordPress.org

    HELP ME

  27. ElectricFeet
    Member
    Posted 11 months ago #

    Please open a new thread as this one is resolved and not related to what you are asking. (Open a new thread from the main list)

    When you do open it, could you explain what you want to change (are you wanting to translate them, for example)?

  28. idacy santana
    Member
    Posted 11 months ago #

    how to change menu bar background color? help me explain how to do code

  29. ElectricFeet
    Member
    Posted 11 months ago #

    This is answered above.

  30. inderchauhan11
    Member
    Posted 6 months ago #

    hi friends i m new here can you anyone help m. i have a wordpress blog addabusiness.wordpress.com. i want to change foreground color. how to change it.

    i change color go head-
    Appearance- custom design- color - foreground color Black to brown. its changed here but not changed on bolg.
    any one help me?

Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic

Tags

No tags yet.