Have you ever woken up in the middle of the night with a sudden urge to change the header colour of your Drupal site? Us neither, but one of our recent clients felt that they might and we wanted them to be as prepared as possible. At first we were going to go the color module route. Crafting some transparent png's and coding up some bits and bytes to make it all work with the theme we had already built. After investigating a little more though we found the color module to be a little overkill for this particular situation so we took a look at what we could do with the Zen theme and it's awesome theme-settings.php file.

We knew we could set a default header colour for our clients site in our zen sub-themes info file and we knew Drupal came with a pretty decent colour picker built in called farbtastic. Now we just had to figure out how to connect the two. Lo and behold, in the theme-settings.php file there is a commented out FAPI function for adding form elements to your sub themes configuration page.

Here's what we ended up doing.

We added this within the themename_settings function in our theme-settings.php file below the $settings = array_merge($defaults, $saved_settings); line and above the $form += zen_settings($saved_settings, $defaults). What this does is adds a farbtastic colour picker to the themes config page and handles the saving of the hex vaule.

<!--?php 
$form = array(); $form['themename_header_color'] = array( '#type' => 'textfield', '#title' => t('Header colour'), '#size' => '7', '#attributes' => array('class' => 'colorpicker_textfield'), '#default_value' => $settings['themename_header_color'], '#description' => t("Choose a colour with the provided colour picker for your themes site header."), '#suffix' => '', ); ?> 

After that, it's as simple as rebuilding your theme registry and picking a colour.

Now to get the colour into our header we had to use the theme_get_setting function. Anywhere you need the hex value you throw that in there and you'll get it all peachy keen like.