Footer Widget Area: How to remove grey background?

  • Unknown's avatar

    Hello! I’ve got 3 problems with my forever theme:
    1)I’m having problems finding a way to remove the grey background of the footer widget area at the bottom, (not the actual footer bar, but the space above that that holds the widgets) I would like to make it white like the rest of my page.

    2) I would like to have only my social media buttons centered, but no matter what area (1-4) I chose to place my widgets it automatically places at the far left. How can I center them to align with the rest of my page?

    3) How can I reduce the size of the font and change the font style in the Widget Footer area? Every time I add a widget the font is way too big.

    My blog is vonzwei.com

    I hope someone can help!! Thanks!

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar

    Hi there,

    1. It looks like you have gotten this taken care of.

    2. The following will center align the social icons within the text widget, if that is what you are looking for.

    #text-3 .textwidget {
        text-align: center;
    }

    Since there are 4 widget areas, you can’t actually align them center unless you want to remove one of the existing widget footer areas.

    3. Which text in the footer widgets do you wish to make smaller. The titles or the content of the widget itself? I’m seeing little text in your footer widgets at this time.

  • Unknown's avatar

    Thank you for responding!
    I ended up filling it all the widget area because it was the only was to move have everything in its place — if I just filled out the 3 widget, it would automatically just filled the 1st widget instead of it’s designated spot.
    The text I’m trying to make smaller is the the titles. I’ve somehow figure out the text (although I’m not sure how I did it now, so I won’t be able to resize it again) but i need help with the oversize titles. Thanks again. I hope to can help with me with this one too!

  • Unknown's avatar

    For post and page titles, the following would allow you to adjust the size.

    .wf-active h1 {
        font-size: 40px;
    }

    For widget titles, add the following and adjust as desire.

    .wf-active .widget-title {
        font-size: 40px;
    }

    If you want only three widgets in the footer, and want those 3 to fill the entire width, that can be done by setting one of the widget areas to “display: none” and then changing the width for the other three so they fill the area. The following disables (hides) widget area 4 (on the far right) and sets the others to fill the area. Due to padding and margins and such, the widest they can be is 28%.

    #supplementary #fourth {
        display: none;
    }
    #supplementary.four .widget-area {
        width: 28%;
    }
  • The topic ‘Footer Widget Area: How to remove grey background?’ is closed to new replies.