Controls
Color Picker
Color picker control lets users select colors from a predefined palette or choose custom colors with optional opacity.
Control Settings
- Alongside Text - Text displayed next to the control
- Alpha Channel - Enable semi-transparent colors with rgba
- Color Palette - Show predefined color options
- Output Format - Choose between
Color
orArray (Color + Slug)
Usage
PHP
<p style="color: <?php echo esc_attr( $attributes['control_name'] ); ?>">
Text with custom color using inline css.
</p>
PHP with Output Format as Array
<p style="color: <?php echo esc_attr( $attributes['control_name']['color'] ); ?>">
Text with custom color using inline css.
</p>
<p class="color-<?php echo esc_attr( $attributes['control_name']['slug'] ); ?>">
Text with custom color using classname.
</p>
Handlebars
<p style="color: {{control_name}}">
{{text}}
</p>
Handlebars with Output Format as Array
<p style="color: {{control_name.color}}">
{{text}}
</p>
<p class="color-{{control_name.slug}}">
{{text}}
</p>
Post Meta
<p style="color: <?php echo esc_attr( get_lzb_meta( 'control_meta_name' ) ); ?>">
Text with custom color.
</p>