How do you change the front color on Andrea Theme

  • Author
  • #653124


    How do you change the front color on Andrea Theme? I would like to change the Header front color to tan.

    The blog I need help with is



    CSS tip When you alter a theme’s stylesheet, you only need to put in the Editor the modification/additions to the CSS, not the entire thing. Read this for more info:

    I do not help with CSS. There’s Staff support for the custom design upgrade and a one Volunteer will help when he has time away from his paid work.

    This is feedback. Please consider toning that blue background down. It’s painful to read the text on it. IMO it’s too LOUD! and makes me want to click out.



    How do I get in touch with the support staff for custom design upgrades? I thought this was the page css upgrades?



    This is the CSS support forum and those who purchase the upgrade are expected to be able to work quite independently. The normal turn-around time on any blogging support forum to get answers to question is between 12 – 24 hours and frequently longer. I’m sorry but you will have to wait for Staff to get to you or for the Volunteer who helps with CSS to log-in and help you.


    Are you wanting to change the post and page titles to tan or are you talking about the top navigation colors? Since you are using a custom header image, there really isn’t anything to change up there.



    Is it possible to change the post and page titles to tan?


    To change post and page titles use the following. I’ve also included the code for the hover color as well just in case you want to change that. The color codes shown below are the original so replace them with the color you desire.

    .entry-title a {
    color: #87B2D8;

    Below is the hover color.

    .entry-title a:hover {
    color: #FFFFFF;



    Is it possible to change the front color of the leave a comment box or change the color of the leave a comment box?



    If possible, can you please show me how to make the changes through a print screen.


    The main styling for the comment text box is found here:

    #respond #comment-form-comment, #comment-form-share-text-padder {
        -moz-transition-duration: 0.3s;
        background: none repeat scroll 0 0 rgba(255, 255, 255, 0.85);
        border: 1px solid rgba(0, 0, 0, 0.2);
        box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.12) inset;
        line-height: 18px !important;
        padding: 10px 10px 5px !important;

    They’ve used RGB values instead of hex so that they can set a level of transparency (the 0.85 on the end). You might try playing with the transparency first. Taking it to 0.65 makes it appear a slightly darker blue (allows more of the background color to show through).

    The bottom box for the name, email and website is here.

    #respond .comment-form-service {
        background: none repeat scroll 0 0 rgba(255, 255, 255, 0.7);
        border-bottom: 1px solid rgba(0, 0, 0, 0.07);
        display: none;
        overflow: hidden;
        padding: 10px 0;

    Again they used RGB and transparency.



    Im confused where I am suppose to put this information.


    @scicompanies, it sounds as if you have no experience or knowledge of CSS, am I correct? I need to know this so that I can respond properly for you.



    @thesacredpath, I figured out how to use CSS. I dont have experience with CSS. Can you assist me with expanding the width of the HR blog Categorizes tabs? I would like to include the entire word in the highlighted blue box. Can you show me through a print screen?


    The site linked to your username, , has been deleted. I need a link to the site you are talking about.



    To widen the top navigation submenus in the Andrea theme, try adding this CSS to your Appearance → Custom Design → CSS page:

    #nav ul ul a {
    width: 150px;


    Thanks DesignSimply, That was so simple.
    Do you know how to change the color on the comment box on the talent management page. Also if you have any design suggestions, please feel free to share.
    Thanks again


    Which color? The font color or the background color? Do you want to change it on all pages, or just on that one?



    Thesacredpath: I would like the change the comment text on all the pages to dark blue front. The background can remain white. Can you please help me change the email, name, website boxes to dark blue front and white background? I copyed the CSS code you sent but it did not work.

    Also I would like to change the email subscription box from white to light blue background. Thanks in advance for the helping.

    Dark blue:#002a53
    Light blue:#3883fa


    I’m not entirely sure I’m clear on what you want.

    The comment box has two states 1) dark blue with dark grey text before you click inside it to add a comment and 2) light with dark grey text after you click inside it to leave a comment. Are you wanting the text dark blue after you click inside the box?

    Right now before you click in the comment box, the text is a very dark grey on a dark blue background and is very difficult to see. Do you want to lighten the color of that text so people can actually read that label?

    When you say you want the text in the comment box a dark blue on white background, are you talking about after someone clicks inside the comment box to leave a comment or before?

    This will take the email username and website fields to white background with the dark blue font.

    #respond .comment-form-fields label {
    background: none repeat scroll 0 0 #FFFFFF;
    color: #002A53;

    This will take the dark “Enter your comment here” text on the dark blue background to the light blue you referenced.

    #respond .comment-textarea label {
    color: #D4E7F7;

    This will take the text the person enters to the dark blue.

    #respond #comment-form-comment, #comment-form-share-text-padder {
    color: #002A53;

    Give those a try and see if I understood correctly.

The topic ‘How do you change the front color on Andrea Theme’ is closed to new replies.