Navigation
Archive / Changing the background colour of footer widget area
This is archived content. Visit our new forum.
  • Author
    Posts
  • October 31, 2014 at 3:42 pm #136134

    Fiona A
    Participant

    Hello,

    I just wondered how I could change the background colour of my footer widget area. Every time I change the navbar colour it changes the footer widget area too.

    Any help would be appreciated.

    Thanks 🙂

    October 31, 2014 at 9:06 pm #136255

    Rad
    Moderator

    Hi Fiona,

    Thanks for posting in.

    Add this css at your customizer’s custom css under Admin > Appearance.

    .x-colophon {
background-color:#cccccc !important;
}

    Use your color 🙂

    Thanks!

    November 1, 2014 at 2:38 pm #136547

    Fiona A
    Participant

    Thanks – the only thing is that it changes the entire footer area.

    The website is http://www.wearedope.co.uk – if you scroll down to the bottom I want the bottom to stay how it is but I want the navbar at the top where the logo is to be white. Maybe I should have asked how to change the top one instead of the bottom.

    Sorry for not explaining it properly.

    November 1, 2014 at 9:58 pm #136667

    Christian
    Moderator

    Hey Fiona,

    Please add the code below in the Appearance > Customize > Custom > CSS.

    .x-logobar {
background-color: white;
}

    Hope that helps. 🙂

    November 7, 2014 at 9:53 am #140303

    Fiona A
    Participant

    Cheers – this worked a treat!

    November 7, 2014 at 2:22 pm #140443

    Darshana
    Moderator

    Glad we were able to help 🙂

    July 15, 2015 at 2:24 pm #331339

    Learning
    Participant

    We are grateful to con across this post. We wanted to change the widget area color like the author of this post originally stated.

    We use the code you gave him the first time and it change the widget area and footer area. We would only like to change the widget area and leave the footer the way it was.

    How would we do that?

    http://prntscr.com/7t3ecl

    Thanks (again)

    July 15, 2015 at 2:29 pm #331347

    Learning
    Participant

    Never mind… We found the solution in a different post that you answered

    July 15, 2015 at 2:41 pm #331356

    Rupok
    Member

    Glad that you got it. Feel free to let us know if you face any other issue. We’ll be happy to assist you.

    Thanks for using X.

    Cheers!

    July 15, 2015 at 2:43 pm #331357

    Learning
    Participant

    But now we need to adjust the space in between the widgets

    http://prntscr.com/7t3mtp

    How can we do this?

    Thanks

    July 15, 2015 at 3:46 pm #331437

    Rupok
    Member

    Hello @learning,

    Thanks for updating! To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

    July 15, 2015 at 4:01 pm #331448

    Learning
    Participant
    This reply has been marked as private.
    July 15, 2015 at 7:40 pm #331571

    Lely
    Moderator

    Hello There,

    Thanks for the URL.
    Are you referring to the space between the title “View Our Feed & Follow For Updates” and the four image? If yes, you may add class mtn to the text widget or you may add the following CSS via Appearance > Customize > Custom > CSS

    footer.x-colophon.top #text-3 {
  margin-top: 10px; /*Adjust this to your preferred space*/
}

    Hope this helps.

  • Author
    Posts