code that duplicate the "footer#colophon" css on parent themes

[bassjobsen]

Question from @mjteves1986:

I found on custom-style-css.php line 56 has a code that duplicate the "footer#colophon" css on parent themes.

if($footer_text_color=get_theme_mod( 'footer_text_color',footer_text_color)) {
    echo 'footer#colophon {color:'.$footer_text_color.';}';
    }    
if($footer_link_color=get_theme_mod( 'footer_link_color',footer_link_color)) {
    echo 'footer#colophon {color:'.$footer_link_color.';}';
    }    

[bassjobsen]

Thanks for posting this issue.
First i will describe the situation. Take a look to the @footer-text-color which defines the default text color of footer#colophon. Definitions are written in LESS and compiled to CSS (jamedo-bootstrap-start-theme/library/assets/css/wpless2css.css).

The default color is set in jamedo-bootstrap-start-theme/wpless2css/wpless2css.less by:

@footer-text-color: #D1D6E7;

This variable will be use in jamedo-bootstrap-start-theme/wpless2css/sitefooter.less

After a clean JBST parent install you will find:

from jamedo-bootstrap-start-theme/library/assets/css/wpless2css.css:

footer#colophon {
    color: #D1D6E7;
}

Which seems to be correct.

To change this color now (without using a child theme) you will have two options:

1. change by LESS; Appeareance > LESS compiler enter in the text area:

@footer-text-color: red;

Press "recompile LESS code" after your changes. Note this change overwrite the setting of the customizer described in step 2 below

2. Use the customizer (Appearance > Customize) to set the text color of the footer:

Now you should consider the working of the Customizer first.
If you change a value in the customizer the preview load your site with your new setting via set_theme_mode(setting,{newvalue}). This value is not saved yet. Without saving there also is NOT compiled new CSS code.
In the case you set a value which has been define in LESS for example the @footer-text-color your change won't be visible in the preview. For this reason custom-style-css.php is add to the source. This code defines in-line styles for variables defined in less and should only be used for preview purposes!

if($footer_text_color=get_theme_mod( 'footer_text_color')) {
    echo 'footer#colophon {color:'.$footer_text_color.';}';
    }    

I found a bug for the last:

Notice: Use of undefined constant color - assumed 'color' in /home/bass/wordpress/wp-content/themes/jamedo-bootstrap-start-theme/functions/custom-style-css.php on line 48

Maybe is this the issue you mentioned. I will fix this in the next update.

In the case of a child theme (recommended!) you got three options to change @footer-text-color. with the first step described as above:

1. define in LESS @footer-text-color: red; in the LESS compiler, or optional add this line to less/custom.less in your child theme's folder.
2. use the customizer
3. make it default for your child theme, define in functions.php (in your child theme's folder):

add_action('jbst_child_settings','jbst_child_set_defaultoptions');
    function jbst_child_set_defaultoptions() {
        if(!defined('footer_text_color'))define('footer_text_color','black');
    }

Notice: When setting default values, or defining LESS variables you ALWAYS have to recompile your CSS (Appearance > LESS compiler) after changes! Removing setting will not always remove them from the database to. In some cases remove them first with remove_theme_mods().

Please let me know if the above fix your issues otherwise could you make more clear where the duplicate CSS take effect.

[bassjobsen]

Customizer don't change the the footer colors. Values will be saved but not compiled.

[bassjobsen]

Footer colors (background, text and link) should work now.
Border colors should be checked