sanitize_callback?

[braadmartin]

sanitize_callback?

[BraadMartin]

In the Customizer context, it's a text input that is tied to a JS object that eventually gets saved with PHP, but as with any Customizer control you associate the "control" to a Customizer "setting", and it's on the setting that you can specify a sanitize_callback().

If you take a look at https://github.com/BraadMartin/components/blob/master/customizer/customizer.php#L43 you'll see:

    // Alpha Color Picker Test Setting
    $wp_customize->add_setting(
        'components_alpha_color_test_setting',
        array(
            'default'     => '#0099CC',
            'type'        => 'theme_mod',
            'capability'  => 'edit_theme_options',
            'transport'   => 'postMessage'
        )
    );

    // Alpha Color Picker Test Control
    $wp_customize->add_control(
        new Customize_Alpha_Color_Control(
            $wp_customize,
            'components_alpha_color_test_control',
            array(
                'label'     => __( 'Alpha Color Picker Test', 'components' ),
                'section'   => 'components_test_section',
                'settings'  => 'components_alpha_color_test_setting',
                'palette'   => array(
                    '#3FADD7',
                    'rgba(0,0,0,0.5)',
                    '#666666',
                    '#F5f5f5',
                    '#333333',
                    '#404040',
                    '#2B4267'
                )
            )
        )
    );

So what we're doing here is defining a Customizer "setting" called components_alpha_color_test_setting, then we're associating a "control" (the Alpha Color Picker control) with that specific setting. This happens in the settings key on the array (third param passed to new Customize_Alpha_Color_Control()).

So to add sanitization, you would specify a sanitize_callback key on the second arg you pass when registering the setting (the array) like so:

    $wp_customize->add_setting(
        'components_alpha_color_test_setting',
        array(
            'default'     => '#0099CC',
            'type'        => 'theme_mod',
            'capability'  => 'edit_theme_options',
            'sanitize_callback' => 'some_sanitization_function', // <-- Change made here
            'transport'   => 'postMessage'
        )
    );

Then you would define function some_sanitization_function() somewhere else in your code and that function would take the raw value of the setting when the user attempts to save it as an input and return the sanitized value as output. If you just want to check for a valid text input you could use sanitize_text_field as your sanitize_callback value, or if you want to ensure the input is a valid hex or RGBa color value you could write a function to handle that.

I hope this helps you. For more information on sanitizing settings in the Customizer check out https://developer.wordpress.org/themes/advanced-topics/customizer-api/#settings

[BraadMartin]

Hello Naeemnur,

What would you like to sanitize? The repo you've opened this issue against contains several separate components. If you're referring to my Alpha Color Picker Customizer control, you can include a sanitize_callback param on the config array you pass to $wp_customize->add_setting(). See https://codex.wordpress.org/Class_Reference/WP_Customize_Manager/add_setting for more information on this.

If you are referring to the non-Customizer version of the Alpha Color Picker, the input there is just a regular text input, and it's up to you to save the value, so you're free to do any sanitizing you want before saving the value.

[hiro288]

Hey Braad,

I was refering to the Alpha Color Picker Customizer control, so it's just a text field?

[hiro288]

Thank you for the detailed response Braad, really appreciate it.