Home / 2011 / July

Monthly Archives: July 2011

Add a color Picker with your WordPress plugin

WordPress comes with the color picker Farbtastic, first head overto download it.

To include the javascript , jscolor.js you can use admin_enqueue_scripts (if you want the color picker to load on the admin side) or use wp_enqueue_scripts (if you want the color picker on the client side). In the example below , I have this loading on the admin side.

//Load Color Picker JS
function jscolor(){
$path = plugins_url('/my-plugin/');
wp_enqueue_script('jscolor',$path. 'jscolor/jscolor.js');
}
add_action('admin_enqueue_scripts','jscolor')

Note that you have to replace my-plugin with the name of the folder for your plugin.
Also the other files for jscolor should be in the same folder as the jscolor.js file.

Now add an input field,

<input class="color {adjust:false}" type="text" name="my_plugin_colorpicker" value="<?php echo $options['my_plugin_colorpicker']; ?>" />

A screenshot of the colorpicker is below:
See