Need help? Check out our Support site, then


How change color of text box for posts and pages?

  1. amyandreallife
    Member

    I am working on the template "Debut": Using the custom CSS option, I am wondering how to override the white color of all the text boxes--for posts and pages? I would like to override the white with a cream color (I yet need to choose a color code/# to match the background image in Photoshop). All forums I have seen so far address going to editor through the appearance link in the dashboard... The trouble I'm having is that this template does not offer changing the CSS through the editor option, only making changes through the custom CSS feature...

    Thanks!

    The blog I need help with is amyrbuckley.wordpress.com.

  2. Hi there - did you still need any help with this? I see you're now using Book Lite. Just let me know if you still need assistance. Thanks!

  3. amyandreallife
    Member

    The website with "Booklight" is another site that I built for my husband (two blogs on my account). We will point his to a domain name that he recently purchased. So, I am still using "Debut." Yes, I could still use help with this. Thanks!!

  4. Hi Amy, my fellow Happiness Engineer designsimply helped with this one. :-) Here's how to change the color of the main column in Debut:

    The background colors for the main content area and sidebar in the debut theme are setup using an image:
    http://s2.wp.com/wp-content/themes/premium/debut/images/sidebar-right.png

    In order to change those colors, you can download the image, adjust the colors, upload the new image to your media library, copy the image URL, and replace YOUR_IMAGE_URL in the example below with the new image URL:

    .sidebar-right #main {
        background: url('YOUR_IMAGE_URL') repeat-y;
    }

    Once you've done that, save the image in the Appearance > Custom Design > CSS editor in your blog dashboard as the final step.

    Add this bit of code as well:

    #entry-container {
        background: inherit;
    }

    There is a second, alternative, method you could use which doesn't require modifying any images. The one drawback to it is that you lose the "gutter" between the main column and the sidebar area. You would need to change "fffacd" to whatever color you decide to use.

    #entry-container {
        background: inherit;
    }
    .sidebar-right #main {
        background: #fffacd;
    }
    #sidebar-container {
        background: #f8e8b3;
        -webkit-border-radius: 0 5px 5px 0;
        -moz-border-radius: 0 5px 5px 0;
        -khtml-border-radius: 0 5px 5px 0;
        border-radius: 0 5px 5px 0;
    }
    .multiple #entry-container .entry {
        border-top: none;
    }

    Please let us know if you need further help!

  5. amyandreallife
    Member

    Hi Kathryn,

    Thanks so much! This worked like a charm. The only question I have is--how do I include all the pages I create to conform to that color? As yet, my other pages are the old white color... I look forward to your response. Thanks again for providing excellent customer service. I recently recommended WordPress to a friend who is also very happy with the service. I will continue recommending it to others. Thanks again,

    Amy B.

  6. Glad that worked!

    For pages, you can try this:

    #main-container,<br /> #primary-nav,<br /> #top-nav ul,<br /> #top-search {<br /> background: url('YOUR_IMAGE_URL');<br /> }

    The background is currently set using this image:

    http://s2.wp.com/wp-content/themes/premium/debut/images/background-overlay.png

    Similar to what you did earlier, you can modify that graphic - or create your own - upload it, and put the path to the file into the code where it says YOUR_IMAGE_URL.

  7. amyandreallife
    Member

    Hi again,

    I did not fully understand changing the image the first go round, so I used the second, alternative, method (code with numbers/colors replaced ). Is there a similar alternative step to changing the colors of pages & posts?

  8. Hi Amy, this seems to work, I've just set it up for you:

    .page #entry-container, .page .comment-title-wrap {<br /> background: #f5f7ed;<br /> }<br />
    You can of course modify the color as you like. Let me know if it works for you!

Topic Closed

This topic has been closed to new replies.

About this Topic