Drupal – Adding a clolor picker with your form item.

Drupal has its own color picker system. Drupal’s Farbtastic is very easy to add a color picker with your drupal form.

here is the code for your form item.

drupal_add_css('misc/farbtastic/farbtastic.css');
drupal_add_js('misc/farbtastic/farbtastic.js');
$form ['site_pagetitlecolor'] = array(
   '#type' => 'textfield',
   '#title' => t('Page Title Color'),
   '#default_value' => '#FFF',
   '#description' => '<div id="site_pagetitlecolor_colorpicker"></div>',
   '#size' => 9,
   '#maxlength' => 7,
   '#suffix' => "<script type='text/javascript'>
     $(document).ready(function() {
       $('#site_pagetitlecolor_colorpicker').farbtastic('#edit-site-pagetitlecolor');
     });
   </script>"
 );?

Adding this will provide your form item with a color picker.  :)

Advertisements

5 thoughts on “Drupal – Adding a clolor picker with your form item.

  1. Still works in Drupal 7.39. As Mayk Brito’s comment says, change $(document) and $(‘#site_pagetitlecolor_colorpicker’) with jQuery(document) and jQuery(‘#site_pagetitlecolor_colorpicker’).

    Awesome post. Thanks!

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s