Control: Colorpicker - 10quality/wpmvc-addon-administrator GitHub Wiki

Control used as a field type to display a Colorpicker.

Colorpicker

Usage

// Namespace and use statement...

class Settings extends Model
{
    // Class properties...

    protected function init()
    {
        // Other properties...

        $this->tabs = [
            'tab_id' => [
                'fields' => [

                    'field_id' => [
                        'type' => 'colorpicker',
                        'title' => __( 'Color picker', 'my-domain' ),
                        'description' => __( 'Color picker using selenium.' ),
                    ],

                    'cp_alpha' => [
                        'type' => 'colorpicker',
                        'title' => __( 'With alpha', 'my-domain' ),
                        'description' => __( 'Color picker using alpha.' ),
                        'control' => [
                            'attributes' => [
                                'data-show-alpha' => 1,
                                'data-format' => 'rgb',
                            ],
                        ],
                    ],

                    // Other fields...
                ],
            ],
        ];
    }
}

Control options

Control Data type Description
attributes array HTML attributes listed as an array. JS colorpicker options can be set as a data attribute.

Supported HTML attributes

Attribute Data type Description
data-show-input int Shows input field. See spectrum documentation showInput. Default: 1
data-allow-empty int Allow transparent. See spectrum documentation allowEmpty. Default: 0
data-show-alpha int Show Alpha range picker. See spectrum documentation showAlpha. Default: 0
data-format string Output format. See spectrum documentation preferredFormat. Default: hex
data-flat int Show flat squared input. See spectrum documentation flat. Default: 0
data-container-class string See spectrum documentation containerClassName. Default: 1