I need to change the style of the title in image field to be a text area rather than a text field. I can achieve this by hacking core in the following way:

image.field.inc line 410

$element['title'] = array(
    '#type' => 'textarea',
    '#title' => t('Title'),
    '#default_value' => isset($item['title']) ? $item['title'] : '',
    '#description' => t('The title is used as a tool tip when the user hovers the mouse over the image.'),
    '#maxlength' => variable_get('image_title_length', 500),
    '#weight' => -1,
    '#access' => (bool) $item['fid'] && $settings['title_field'],

// Change '#type' => 'textarea'  to '#type' => 'textfield'

I don't though, want to hack core. How can I create a preprocess function to allow me to do this via my template.php.

1 Answer 1


You won't (easily) be able to use a preprocess function to do this as the element is generated by a form.

You could use a non-generic hook_form_alter() implementation to do this on a single form, but the best way would be to write a small custom module and implementhook_field_widget_form_alter() to override the element.

The alt and title fields (along with some others) are only added in a #process function of each image element (image_field_widget_process()), so you'll need to add your own #process function to run after that one, and alter the field type in there.

The following code is tested and seems to work well (including playing nicely with the AJAX functionality on the image field):

function MYMODULE_field_widget_form_alter(&$element, &$form_state, $context) {
  // If this is an image field type
  if ($context['field']['type'] == 'image') {
    // Loop through the element children (there will always be at least one).
    foreach (element_children($element) as $key => $child) {
      // Add the new process function to the element
      $element[$key]['#process'][] = 'MYMODULE_image_field_widget_process';

function MYMODULE_image_field_widget_process($element, &$form_state, $form) {
  // Change the title field to a textarea
  $element['title']['#type'] = 'textarea';

  // Return the altered element
  return $element;

It produces results like this:


It might be worth bearing in mind that the maximum size of the title column is set in the database, so you won't be able to go any higher than 1024 characters.

  • Nice! and what to do if I would like to add additional css class to an image in the same way? I'm looking for a solution to be able to add class and it may be different in different cases. As I understand this could be achieved in some similar way, right? Mar 20, 2013 at 21:13
  • Unfortunately not - the alt and title columns are already part of the image field, this method is just replacing the textfield with a textarea on the widget form. It's not adding any extra data to the field at all. To add another column, which takes a class, you'd be looking at implementing a custom field which is a lot more work
    – Clive
    Mar 20, 2013 at 21:33
  • Could you give me a hint on where to start reading - as I understand now, for this I need to write a small module (I guess) ? Mar 20, 2013 at 21:35

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.