Support » Theme: Magazine Basic » [Theme: Magazine Basic] Change Sidebar Background Color

  • Resolved davezan


    Hi guys!

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

Viewing 5 replies - 1 through 5 (of 5 total)
  • 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?



    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, 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.]

    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.



    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!

    Happy blogging!


Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘[Theme: Magazine Basic] Change Sidebar Background Color’ is closed to new replies.