Color

Color field allows to pick color from color picker.

Field Parameters

Name Type Default Description
type string ‘color’ Value identifies the field types.
id string Identifies unique ID for the field. It must be different from other existing field IDs.
title string Displays the field label.
desc string Describe the field option in details, appears underneath the field control.
required array Acts like boolean operator and provides the parent, comparison operation, and value which decides the field visibility.
value string Display default string in the text input.
options array Add some settings

Example Declaration

array(
    'id'    => 'font-color',
    'title' => esc_html__( 'Font Color', 'ultimate-page-builder' ),
    'desc'  => wp_kses_post( __( 'Choose font Color', 'ultimate-page-builder' )),
    'type'  => 'color',
    'value' => '#1e73be',
    'options'=> array(
        'alpha' => true // Enable RGBA Color
        'palettes' => array( '#000', '#fff', '#d33', '#d93', '#ee2', '#81d742', '#1e73be', '#8224e3' ) // Defaults palettes
    )
);

Alpha ( rgba ) color

  • pass alpha=> true on options to enable alpha colors.

Color palettes

  • Default palettes is array( '#000', '#fff', '#d33', '#d93', '#ee2', '#81d742', '#1e73be', '#8224e3' )

  • Change global color palettes by upb_color_input_option_palettes filter

Example:

array(
    'id'    => 'font-color',
    'title' => esc_html__( 'Font Color', 'ultimate-page-builder' ),
    'desc'  => wp_kses_post( __( 'Choose font Color', 'ultimate-page-builder' )),
    'type'  => 'color',
    'value' => 'rgba(0,0,0,0.45)',
    'options'=> array(
        'alpha' => true // Enable RGBA Color
        'palettes' => array( 'rgba(0,0,0,0.45)', '#fff', '#d33', '#d93', '#ee2', '#81d742', '#1e73be', '#8224e3' ) // Defaults palettes
    )
);

results matching ""

    No results matching ""