0

I am currently developing a theme which provides more customization in Customizer. I am trying to add color control option and it is not working. This is my code.

/* Color Section */
    
    $wp_customize -> add_setting( 'navbar_color', array(
        'default' => '#45ace0',
    ) );

    $wp_customize -> add_control( new WP_Customize_Color_Control( $wp_customize, 'navbar_color', array(
            'label'     => __( 'Navbar Color', 'text_domain' ),
            'section'   => 'color_section',
            'settings'  => 'navbar_color',
        )
        
    ) );
    
    $wp_customize -> add_section( 'color_section', array(
        'title'     => __( 'Color Section', 'text_domain' ),
    ) );

I can't see anything wrong here. Without this customizer is working. But when i add this code, customizer is not loading without any PHP error. Also when i replace to WP_Customize_Color_Control to WP_Customize_Image_Control it working without any problem. This problem only happens with Color Control.

Also, I am getting following JS errors in the console.

enter image description here

any solution would be really appreciated.

1

Try changing your ID name to another one. Maybe is an ID already in use:

navbar_color

To:

my_navbar_color
0

According to your needs :

Register Your Customizer setting , Add Below Code in your functions.php

function themename_customize_register($wp_customize){

$wp_customize->add_section('themename_color_scheme', array(
    'title'    => __('Color Scheme', 'themename'),
    'priority' => 120,
));

//  =============================
//  = Color Picker              =
//  =============================

$wp_customize->add_setting('themename_theme_options[navbar_color]', array(
    'default'           => '#000',
    'sanitize_callback' => 'sanitize_hex_color',
    'capability'        => 'edit_theme_options',
    'type'           => 'option',

));

$wp_customize->add_control( new WP_Customize_Color_Control($wp_customize, 'navbar_color', array(
    'label'    => __('Link Color', 'themename'),
    'section'  => 'themename_color_scheme',
    'settings' => 'themename_theme_options[navbar_color]',
)));


//  =============================
//  = Text Input                =
//  =============================
$wp_customize->add_setting('themename_theme_options[text_test]', array(
    'default'        => 'Custom Text!',
    'capability'     => 'edit_theme_options',
    'type'           => 'option',

));

$wp_customize->add_control('themename_text_test', array(
    'label'      => __('Text Test', 'themename'),
    'section'    => 'themename_color_scheme',
    'settings'   => 'themename_theme_options[text_test]',
));

//  =============================
//  = Image Upload              =
//  =============================
$wp_customize->add_setting('themename_theme_options[image_upload_test]', array(
    'default'           => 'image.jpg',
    'capability'        => 'edit_theme_options',
    'type'           => 'option',

));

$wp_customize->add_control( new WP_Customize_Image_Control($wp_customize, 'image_upload_test', array(
    'label'    => __('Image Upload Test', 'themename'),
    'section'  => 'themename_color_scheme',
    'settings' => 'themename_theme_options[image_upload_test]',
)));

//  =============================
//  = File Upload               =
//  =============================
$wp_customize->add_setting('themename_theme_options[upload_test]', array(
    'default'           => 'arse',
    'capability'        => 'edit_theme_options',
    'type'           => 'option',

));

$wp_customize->add_control( new WP_Customize_Upload_Control($wp_customize, 'upload_test', array(
    'label'    => __('Upload Test', 'themename'),
    'section'  => 'themename_color_scheme',
    'settings' => 'themename_theme_options[upload_test]',
)));

 }

add_action('customize_register', 'themename_customize_register');

Refer Link For Your Knowledge Click

enter image description here

3
  • Thank you for your reply and also the link you provided is very useful for me. However i am still having this problem. This problem only occurs when using WP_Customize_Color_Control. I can use WP_Customize_Media_Control and WP_Customize_Image_Control without any problem. When using WP_Customize_Color_Control customizer loading infinitely. I think it because of JS error i have provided above. But i can't figure it out. – sahan Jan 4 at 8:02
  • My code is Modify check and Add New Setting for image upload & file upload On your functions.php – HK89 Jan 4 at 8:23
  • I think you have misunderstood my question. My problem is not with how to add image control or file control. I have no issue about using them. My problem is only when i use Wp_Customize_Color_Control customizer is not loading because of that Javascript error. There are lot of Javascript errors when using WP_Customize_Color_Control and i have provided them with an image above. – sahan Jan 4 at 8:55
0

Finally found the reason. The reason was i enqueued JQuery to my options pages. When i remove JQuery enqueue everything is working fine. Thanks for all the replies.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.