Change Footer Widget Colors
- The topic ‘Change Footer Widget Colors’ is closed to new replies.
Need help? Check out our Support site, then
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)
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
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
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
Thanks