I am following up with my previous tutorial on how to implement IRIS colour picker for wordpress. Since IRIS is already bundled with wordpress, we improvise and make use of the colour picker that already comes as built in inside wordpress core. This tutorial is based on New colour picker in WP 3.5
We implement the colour picker in 3 easy steps:
1. Lets enqueue all scripts and styles
add_action( 'admin_enqueue_scripts', 'softlights_admin_scripts' );
function softlights_admin_scripts($hook) {
if('appearance_page_sl-theme-options' != $hook) {
return;
}
wp_enqueue_script('jquery');
wp_enqueue_style( 'wp-color-picker' );
wp_enqueue_script( 'sl-script-handle', get_template_directory_uri().'/myscript.js', array( 'wp-color-picker','jquery' ), false, true );
}
2. We create a new .js file named myscript.js and we put the following code inside.
jQuery(document).ready(function($){
$('.color-picker').wpColorPicker();
});
3. Finally we call the colour picker like this in theme options page or on functions.php. The value class = “colour-picker” is the key and calls the wordpress colour picker to popup.
<input type="text" name="color" class="color-picker" value="#bada55" />
Thats it! It should work like a charm!
