Skip to content

Instantly share code, notes, and snippets.

@neilgee
Last active November 20, 2020 04:43
Show Gist options
  • Save neilgee/8917f0f4d120038051c158d9b667e848 to your computer and use it in GitHub Desktop.
Save neilgee/8917f0f4d120038051c158d9b667e848 to your computer and use it in GitHub Desktop.
Add RGBa Alpha color to WordPress Plugin
function my_overlay_callback() {
$options = get_option( 'plugin_settings' );
if( !isset( $options['my_overlay'] ) ) $options['my_overlay'] = 'rgba(0,0,0,0.85)';
echo '<input type="text" class="color-picker" data-alpha-enabled="true" data-default-color="rgba(0,0,0,0.85)" name="plugin_settings[my_overlay]" value="' . sanitize_text_field($options['my_overlay']) . '"/>';
}
function my_plugin_admin_scripts($hook) {
if ( 'settings_page_myplugin' != $hook ) { //set your plugin page
return;
}
wp_enqueue_style( 'wp-color-picker' );
wp_enqueue_script( 'wp-color-picker-alpha', plugins_url( '/js/wp-color-picker-alpha.min.js', __FILE__ ), array( 'wp-color-picker' ), '3.0.0', true );
wp_enqueue_script( 'wp-color-picker-init', plugins_url( '/js/'wp-color-picker-init.js', __FILE__ ), array( 'wp-color-picker-alpha' ), '3.0.0', true );
}
add_action( 'admin_enqueue_scripts', 'my_plugin_admin_scripts' );
jQuery(document).ready(function($){
/* Call the Color Picker */
$( ".color-picker" ).wpColorPicker();
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment