Change Footer Widget Colors

  • Author
    Posts
  • #160505
    sdavis56
    Member

    Can I change the background, text, and link colors of the footer widget?

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

    #160542
    themezee
    Theme Author

    Hi again,

    You can change these with extra CSS code:

    .footer-widgets-wrap {
        background: #333;
        color: #fff;
    }
    
    .footer-widgets-wrap .widget-title {
        color: #fff;
    }
    
    .footer-widgets-wrap .widget a:link,
    .footer-widgets-wrap .widget a:visited {
        color: #ddd;
    }
    
    .footer-widgets-wrap .widget a:hover,
    .footer-widgets-wrap .widget a:active {
        color: #fff;
    }

    You can copy the CSS snippet and insert it on Customize > CSS. You can then adjust the hex color codes as you like.

    Cheers,
    Thomas

    #160548
    sdavis56
    Member
    Original poster

    Thanks, now I just have a problem with the margins/padding of the color border. How do I make the border extend to the edge of the white space or more the items within the widget not be on the edge of the border?

    See this image to help explain what I am asking: https://drive.google.com/file/d/15yDzSJlMI-LA_dkXnWD-50X-RvZVBERc/view?usp=sharing

    #160591
    themezee
    Theme Author

    You can add some spacing with this short CSS snippet:

    .footer-widgets-wrap {
        padding-left: 3em;
        padding-right: 3em;
    }

    The site container has also some spacing over the whole page, so it is not possible to extend the footer widgets to the whole container.

    Cheers,
    Thomas

    #160617
    sdavis56
    Member
    Original poster

    Thanks

  • The topic ‘Change Footer Widget Colors’ is closed to new replies.