WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Theme customizer won't save theme options (3 posts)

  1. I have the following code in my functions.php file:

    function bold_headline_theme_customizer( $wp_customize ) {
    
    	$wp_customize->add_setting( 'bold_headline[nav_color]', array(
            'default'   => '#404040',
            'transport' => 'postMessage',
        ) );
    
        $wp_customize->add_control( new WP_Customize_Color_Control( $wp_customize, 'bold_headline[nav_color]', array(
            'label'	   => 'Navigation Bar Color',
            'section'  => 'colors',
            'settings' => 'bold_headline[nav_color]',
        ) ) );
    
    }
    add_action('customize_register', 'bold_headline_theme_customizer');
    
    ...
    
    function bold_headline_add_customizer_css() {
    	<style>
    		.navigation-main,
    		.navigation-main ul ul {
    			background: <?php echo get_theme_mod( 'bold_headline[nav_color]', '#404040' ); ?>;
    		}
    
    	</style>
    <?php }
    add_action( 'wp_head', 'bold_headline_add_customizer_css' );

    My javascript file has the following:

    wp.customize( 'bold_headline[nav_color]', function( value ) {
            value.bind( function( to ) {
                $('.navigation-main, .navigation-main ul ul').css('background', to );     
    
            });
        });

    I'm enqueuing the js has recommended.
    If I use the setting bold_headline[nav_color] I can customize the colour and see it in the preview. i.e, the javascript is doing what it's supposed to. However, no value is picked up by get_theme_mod and the css is left blank.

    If I change the value from bold_headline[nav_color] to nav_color, then the custom CSS displays as it should in the header, but the js stops working.

    I'm clearly missing something somewhere and would love a fresh set of eyes to look at this.

    :(

    Thanks

  2. hiphopinenglish
    Member
    Posted 1 year ago #

    Your JS affects bold_headline[nav-color] - if you change the name of that setting in functions.php you need to change the value in your JS. In your case, if you change to nav_color in functions.php, line 1 of your JS above should read:
    wp.customize( 'nav_color', function( value ) {

    Does that help?

  3. I just realized I never answered this or thanked hiphopinenglish. :/

    I managed to get this sorted out and submitted my theme to the repo. For those of you who are looking at ways to use the customizer in your theme, just download Bold Headline and look at the customizer.php in the inc folder.

    Hope this helps.

Topic Closed

This topic has been closed to new replies.

About this Topic