Header and Body Colour - by ademide - on WordPress WooCommerce support

Solved11 replies3 participantsUpdated by Jack Richardson

  • Avatar: ademide
    ademide
    Participant

    Hello,
    Thanks for your help so far, I’m loving your theme.
    Please I’d like to change the colour of the header on my site, and if possible, the page body as well, as I’d rather have a dark colour.
    Could you please help with the code for it, or any instructions on how to get this done?
    Thank you!

    #69439 Copied Theme version: 3.1 WooCommerce version: 4.2.2

    11 Answers

    Avatar: Jack Richardson
    Jack Richardson
    Support staff

    Hello,

    Try to use the following css code in custom.css:

    .containerInner.clearfix {
background-color: grey !important;
}

    To create custom.css you need rename default.custom.css to custom.css in wp-content/themes/blanco directory via FTP and enable it in Blanco – Theme Settings, tick “Enable Custom CSS file”.

    Best regards,
    Jack Richardson.

    #69457 Copied
    Avatar: ademide
    ademide
    Participant

    Hello Jack,

    Thanks for your response. I have put the code in custom css. (I renamed it a while ago) but it isn’t working. Please help! Thanks.

    #69816 Copied
    Avatar: Robert Hall
    Robert Hall
    Participant

    Hello,

    As I see you’re already added code for page body and it’s working perfect.
    To change header background use this code in custom.css file:

    #header{
background-color: red;
}

    Regards,
    Robert Hall.

    #69818 Copied
    Avatar: ademide
    ademide
    Participant

    Hello,

    Neither code is working. I have added, and checked, but the page is still the same.
    Could you take another look please? My page body is still white, and the header hasn’t changed too.

    Thanks.

    #69822 Copied
    Avatar: Robert Hall
    Robert Hall
    Participant

    Hello,

    Please clean all cache and then check.
    If issue is not solved then provide us with wp-admin and FTP credentials in Private Content.

    Regards,
    Robert Hall.

    #69833 Copied
    Avatar: ademide
    ademide
    Participant

    Hello,
    I flushed the cache and it worked. Thank you very much.
    I found that the header didn’t look good in red though, so I’m thinking of changing just the menu. What’s the code for that please? Many thanks.

    #69875 Copied
    Avatar: Jack Richardson
    Jack Richardson
    Support staff

    Hello,

    Please add this code in custom.css file:

    .menu {
   background-color: red !important;
}

    Best regards,
    Jack Richardson.

    #69965 Copied
    Avatar: ademide
    ademide
    Participant

    Thanks Jack,
    It worked perfectly.
    One more question please.
    I tried to change the header layout using css., but it didn’t come out too well.
    I want the logo in the upper centre region, with the search tab on the left. I got that to work with this code:
    .logo img {
    margin-left: 75%;
    }
    #search {
    margin-right: 70%;
    margin-top: 20px;
    }

    But the cart got displaced. It is distorted. I’ve tried to add this code:
    #top-cart {
    margin-left: 80%;
    margin-top: 10px!important;
    }

    but nothing changed. What am I doing wrong please?
    Many thanks.

    #69967 Copied
    Avatar: Jack Richardson
    Jack Richardson
    Support staff

    Hello,

    Please try the following css code instead of yours:

    .logo {
float: none !important;
margin-left: 30% !important;
}
#top-cart {
margin-top: -20px !important;
}
#links {
margin-right: -280px;
}

    Is that what you want?

    Best regards,
    Jack Richardson.

    #69983 Copied
    Avatar: ademide
    ademide
    Participant

    Hello!
    I replaced this with mine, but the cart tab was a cm higher than the search tab, so I added this to it;
    #search {
    margin-top: -20px;
    }

    and it is perfect right now!
    I’m really glad. Thank you very much, you guys are awesome. 🙂

    #69995 Copied
    Avatar: Jack Richardson
    Jack Richardson
    Support staff

    Hello,

    You are welcome!

    Best regards,
    Jack Richardson.

    #70000 Copied

The issue related to '‘Header and Body Colour’' has been successfully resolved, and the topic is now closed for further responses