Site logo

Archived topic

Issues with Customizer custom controls

16 replies · Started by George on April 12, 2021

Viewing posts 16–17 of 17

No problem :)

Hi Tom. Really sorry for opening this up again.

My settings stopped working for some reason and I am not sure if it was the latest GP or GPP update. I installed a previous GP version and it didn't do the trick either. Basically, the settings are loaded into the Customizer but any color changes from the custom ones I've added are not being registered. As a reminder, here is the full code:

// Extra Customizer color settings
function my_defaults() {
    return array(
        'gp_comment_color' => '#ff4b4b',
        'gp_background_link_color_hover' => '#fcefe7',
        'gp_blog_box_shadow_color' => '#FEC445',
        'gp_blog_post_title_underine_hover_color' => '#005D55',
        'gp_rundown_underline_link_color' => '#ff4b4b',
    );
}

function gp_customize_color( $wp_customize) {

    $wp_customize->add_section(
        'gp_comment_section',
        array(
            'title' => $wp_customize->get_panel( 'generate_colors_panel' ) ? __( 'Comments', 'generatepress' ) : __( 'Colors', 'generatepress' ),
            'capability' => 'edit_theme_options',
            'priority' => 80,
            'panel' => $wp_customize->get_panel( 'generate_colors_panel' ) ? 'generate_colors_panel' : false,
        )
    );  
    
    $wp_customize->add_setting(
        'gp_settings[gp_comment_color]',
        array(
            'default' => $defaults['gp_comment_color'],
            'type' => 'option',
            'sanitize_callback' => 'generate_sanitize_hex_color',
            'transport' => 'refresh',
        )
    );

    $wp_customize->add_setting(
            'gp_settings[gp_background_link_color_hover]',
            array(
                'default' => $defaults['gp_background_link_color_hover'],
                'type' => 'option',
                'sanitize_callback' => 'generate_sanitize_hex_color',
                'transport' => 'refresh',
            )
        );

    $wp_customize->add_setting(
            'gp_settings[gp_blog_box_shadow_color]',
            array(
                'default' => $defaults['gp_blog_box_shadow_color'],
                'type' => 'option',
                'sanitize_callback' => 'generate_sanitize_hex_color',
                'transport' => 'refresh',
            )
        );             

    $wp_customize->add_setting(
            'gp_settings[gp_blog_post_title_underine_hover_color]',
            array(      
                'default' => $defaults['gp_blog_post_title_underine_hover_color'],
                'type' => 'option',
                'sanitize_callback' => 'generate_sanitize_hex_color',
                'transport' => 'refresh',
            )
        );   

    $wp_customize->add_setting(
            'gp_settings[gp_rundown_underline_link_color]',
            array(
                'default' => $defaults['gp_rundown_underline_link_color'],
                'type' => 'option',
                'sanitize_callback' => 'generate_sanitize_hex_color',
                'transport' => 'refresh',
            )
        );     

    $wp_customize->add_control(
        new WP_Customize_Color_Control(
            $wp_customize,
            'gp_settings[gp_comment_color]',
            array(
                'label' => __( 'Base Color', 'generatepress' ),
                'section' => 'gp_comment_section',
                'settings' => 'gp_settings[gp_comment_color]',
            )
        )
    );

    $wp_customize->add_control(
            new WP_Customize_Color_Control(
                $wp_customize,
                'gp_settings[gp_background_link_color_hover]',
                array(
                    'priority' => 20,
                    'label' => __( 'Background Link Color Hover', 'generatepress' ),
                    'section' => 'body_section',
                    'settings' => 'gp_settings[gp_background_link_color_hover]',
                )
            )
    );

    $wp_customize->add_control(
            new WP_Customize_Color_Control(
                $wp_customize,
                'gp_settings[gp_blog_box_shadow_color]',
                array(
                    'priority' => 20,
                    'label' => __( 'Blog Box Shadow Color', 'generatepress' ),
                    'section' => 'body_section',
                    'settings' => 'gp_settings[gp_blog_box_shadow_color]',
                )
            )
    );    

    $wp_customize->add_control(
            new WP_Customize_Color_Control(
                $wp_customize,
                'gp_settings[gp_blog_post_title_underine_hover_color]',
                array(
                    'priority' => 20,
                    'label' => __( 'Blog Post Title Underline Hover Color', 'generatepress' ),
                    'section' => 'body_section',
                    'settings' => 'gp_settings[gp_blog_post_title_underine_hover_color]',
                )
            )
    );

    $wp_customize->add_control(
            new WP_Customize_Color_Control(
                $wp_customize,
                'gp_settings[gp_rundown_underline_link_color]',
                array(
                    'priority' => 20,
                    'label' => __( 'Rundown Underline Link Color', 'generatepress' ),
                    'section' => 'body_section',
                    'settings' => 'gp_settings[gp_rundown_underline_link_color]',
                )
            )
    );         

}

add_action('customize_register', 'gp_customize_color');

//Output Customizer CSS
function gp_customize_css() { 

    $defaults = my_defaults();

    $options = wp_parse_args(
        get_option( 'my_color', 'array()' ),
        $defaults
    );

    ?>

    <style type="text/css">

        .comments-title::before,
        .comment-reply-title::before {
            background-color: <?php echo $options['gp_comment_color']; ?>;
        }

        .comment-content .reply a::after,
        .comment-content .reply a:hover {
            color: <?php echo $options['gp_comment_color']; ?>;
        }

        .comment-content .reply a::after,
        .comment-content .reply a:hover {
            color: <?php echo $options['gp_comment_color']; ?>;
        }

        .entry-content a:hover,
        .author-container .by-author a:hover {
            background-color: <?php echo $options['gp_background_link_color_hover']; ?>;
        }

        .entry-content p a,
        .entry-content ul li a,
        .entry-content ol li a,
        .author-container .by-author a {
            border-bottom: 6px solid <?php echo $options['gp_background_link_color_hover']; ?>;
            box-shadow: inset 0px -2px 0px <?php echo $options['gp_background_link_color_hover']; ?>;
        }

        .blog .dynamic-content-template .blog-container:hover,
        .author .dynamic-content-template .blog-container:hover,
        .category .dynamic-content-template .blog-container:hover,
        .search-results .dynamic-content-template .blog-container:hover {
            box-shadow: 5px 5px 0 <?php echo $options['gp_blog_box_shadow_color']; ?>;
        } 

        .blog .dynamic-content-template:hover div.gb-headline-text a,
        .author .dynamic-content-template:hover div.gb-headline-text a,
        .category .dynamic-content-template:hover div.gb-headline-text a,
        .search-results .dynamic-content-template:hover div.gb-headline-text a {
            background: linear-gradient(to right,<?php echo $options['gp_blog_post_title_underine_hover_color']; ?> 0,<?php echo $options['gp_blog_post_title_underine_hover_color']; ?> 100%);
            background-position: 0 85%;
            background-repeat: repeat-x;
            background-size: 100% 2px;
            -webkit-transition: background-image .25s ease;
            transition: background-image .25s ease;
        }

        @media (min-width: 769px) {
            body:not(.full-width-content) .site-main article:not(.comment-body) {
                border-bottom: 60px solid <?php echo generate_get_option( 'background_color' ); ?>;
            }
        }

        .rundown ul li p.rundown-title a {
            border-bottom: 0;
            box-shadow: inset 0px -2px 0px <?php echo $options['gp_rundown_underline_link_color']; ?>;
        }

}

    </style>
<?php }

add_action('wp_head', 'gp_customize_css');

Basically, two questions:
1. Is there a reason that it's not working anymore?
2. Does it make sense to create custom settings for clients like this? I don't want it to break on every GB update but then how else could I house their needs? Especially now with the new global colors coming to 3.1.0, will this system work? What would be the best approach to creating custom sections in the Customizer? Would I be better of making use of global colors but be limited to the way GP is presenting them (eg: no obvious naming of the color, just a label on the color hover)?

Thanks

This archived topic is closed to new replies.