Changing background and text colour of footer widgets

Hello Ali,

Thank you for contacting us about changing the background color of a footer widget. You should be able to edit the “Text” widgets in the Customizer. If there is no option for editing the type color, you can use the “Text” editor instead. For example, you could use basic HTML to set the background and text color, such as:

<p style=”background-color:#808080;”><font color=”white”>Test</font></p>

The colors of menus and search bars may be set by the theme if they do not have options in the Customizer. If you are familiar with coding CSS, you can use Google Chrome Developer Tools to Customize CSS. We are happy to help you troubleshoot further, but will need some additional information. Can you provide a link to the site for us to view and test?

Thank you,

John-Paul

Hi Ali.

I visited your site and it appears that your text is white and the background is grey in your footer. I’m not exactly sure what issue you are experiencing with you customizations in the code.

Best Regards,

Carlos D

Hello Ali,

Thank you for your patience. I was able to identify a few objects to customize the CSS (using Google Chrome Dev Tools) for the elements on the page that should provide the appearance you are looking for.

.palette-primary .well {
border: none;
}
.palette-primary .site-footer a {
color: #eee;
}

.palette-primary .widget-title {
color: #eee;
}

Now, the first footer (farthest to the left) may need to be recreated because the formatting is different from the other three (3). However, from my view, they all appear with white text (for links and widget titles) when I use this code. The borders were removed as well. I hope this helps!

Sincerely,
Carlos D