I have moved the disclaimer to a footer widget to be sure that it displays regardless of the device. However, the same problem of the copyright not appearing and the footer background changing to a greyish color exists on an older version of IE as well.
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Can you link to a page with the issue
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
How did you get that copyright in there?
In Atomic Options there is a special area for the copyright.
Appearance –> Atomic Options –> Copyright Text
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Does it also have an option to put the text colour?
The color option is for the copyright text color, not the footer background color.
The copyright and footer text appears white on a black background. On mobile, the footer text appears black on a grey background and the copyright text does not appear at all.
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Yes it’s because the grey background doesn’t show on mobile. So, it’s just white text on a white background.
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
If you’re not using a Child Theme, and if the theme doesn’t have a designated section of the dashboard for CSS modifications then install this Custom CSS Manager plugin http://wordpress.org/plugins/custom-css-manager-plugin
Then use its “CSS Code” section of the dashboard to hold your CSS modifications:
Alternatively use your Child Theme style.css file to hold your CSS modifications:
#footer-widgets ~ div {
color: #201E1C !important;
}
@media screen and (min-width: 1000px) {
#footer-widgets ~ div {
color: inherit !important;
}
}
Wow, thanks Andrew. I do have a child theme so I added it there.
One more question. I realize that if the footer is black on the mobile devices then the black text won’t be displayed (black on black) but I was wondering if the footer could be black and the text white, like on the original pages.
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
I realize that if the footer is black on the mobile devices then the black text won’t be displayed (black on black)
Do you have that choice, to set the footer black?
The footer is themed black on a regular screen but is then white on mobile and older browsers. Must be somewhere in the stylesheet. The only option for the footer is the copyright text color.
So, on regular screens the footer widgets and the copyright text are white on a black background. On mobile screens the footer background is white and the widget text is black. Now, the copyright text is black also thanks to your modification.
If possible I would like the mobile screens to appear the same as the regular screens.
Hi Susan,
I’ll take a look at this and get back to you with a solution. I may not have time until tomorrow, but just wanted to let you know I saw this.
Kyle
Susan,
This is how I fixed the invisible copyright text…
Edit footer.php and change:
php if ( of_get_option( 'copyright', '1' ) && of_get_default('copyright') ) {
echo '<div style="padding: 0em 0 2.5em 0; text-align: center;';
if ( of_get_option( 'copyright', '' ) ) {
$typography = of_get_option('copyright_typography');
} else $typography = of_get_default('copyright_typography');
echo 'font-family: ' . $typography['face'] . '; font-size:' . $typography['size'] . '; font-style: ' . $typography['style'] . '; color:'.$typography['color'] . ';">';
echo of_get_option( 'copyright_text', of_get_default('copyright_text') ); echo '</div>';
} ?>
to
php if ( of_get_option( 'copyright', '1' ) && of_get_default('copyright') ) {
echo '<div class="copyright" style="padding: 0em 0 2.5em 0; text-align: center;';
if ( of_get_option( 'copyright', '' ) ) {
$typography = of_get_option('copyright_typography');
} else $typography = of_get_default('copyright_typography');
echo 'font-family: ' . $typography['face'] . '; font-size:' . $typography['size'] . '; font-style: ' . $typography['style'] . '; color:'.$typography['color'] . ';">';
echo of_get_option( 'copyright_text', of_get_default('copyright_text') ); echo '</div>';
} ?>
And add to style.css:
@media screen and (max-width: 62.5em) {
.copyright {
color:#000000 !important;
}
}
Thanks Kyle — I’ll give it a try this weekend.
