WordPress.org

Ready to get started?Download WordPress

Forums

Magazine Basic
[resolved] Change Sidebar Background Color (6 posts)

  1. davezan
    Member
    Posted 2 years ago #

    Hi guys!

    How do I change the sidebar's background color to that of the navigation
    bar at the bottom? Temporary site is http://davezan.com/test since that's
    a...hehe...test site, and I'll take it down soon.

  2. peredur
    Member
    Posted 2 years ago #

    I don't see a navigation bar at the bottom. Also, are you wanting to change the background colour of the widgets or of the sidebar itself?

    Cheers

    PAE

  3. davezan
    Member
    Posted 2 years ago #

    Oh, by navigation bar I mean the page navigation thing at the bottom. I'd
    also say it's the widget's background color I want to change since they're
    showing those kind of diagonal lines.

    I thought of modifying that part to use the same "light gray" color or so
    of the page navi thing below. I've since used that testing theme onto my
    actual blog DaveZan.com, so feel free to check that instead.

    [Weirdly, I can't seem to install FireFox (and thus FireBug) on my laptop,
    so that'll probably have to wait. Still, thanks for suggesting that in my
    previous thread.]

  4. peredur
    Member
    Posted 2 years ago #

    Well, all I can see is a copyright notice and some acknowledgements at the bottom. Do you mean the primary navigation menu, that appears below the header?

    I can see three widgets, Follow Me, the search box and Blog Sponsors.

    Assuming it's the background colour of these widgets that you want to change, then you need to change this rule:

    .side-widget {
      ...
      background-color: transparent;
      background-image: url("images/bg-hatch.gif");
      ...
    }

    You should, of course, make any changes in a Child Theme, to save yourself all manner of grief later on. Child themes are trivial to create, so there's really no excuse for not using them unless your parent theme explicitly does not support them or you're using an old version of WP.

    Having said that, you can change the background of the widgets in question by creating a new style rule in your child theme as follows:

    .side-widget {
      background-color: red;  /* whatever colour you want */
      background-image: none;
    }

    As for FireFox. You can't really do Web development without FireFox, although Chrome is catching up (there is a version of FireBug - or a FireBug equivalent - for Chrome). Whatever you do, don't use Internet Explorer.

    HTH

    PAE

  5. davezan
    Member
    Posted 2 years ago #

    He he, the page navigation bar is the one where it says Page 1 of 31. Sorry, I should've specifically referred to that one.

    What you described about the widget background is the one I'm looking for. I've tinkered with the code and used the one you mentioned, and it worked. :)

    Finally, you're right about Chrome having a Firebug equivalent. I've since downloaded and installed it, so I think I can handle it from here.

    Thanks again! Cheers!

  6. peredur
    Member
    Posted 2 years ago #

    Happy blogging!

    PAE

Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic