Last updated 9 December 2016. Created on 15 May 2013.
Edited by jrockowitz, ryanjbonnell, jsruzicka, technicalknockout. Log in to edit this page.

An HTML 5 placeholder attribute is added to a theme by using a preprocess hook. This example is for an e-mail component:

function THEMENAME_preprocess_webform_email(&$variables) {
  $variables['element']['#attributes']['placeholder'] = t('Email Address');

For anyone using an older or outdated version of Webform, it's worth noting that HTML5 placeholder support was added in the 7.x-4.x branch (June 2013) and is now a native, built-in option when adding or editing a form component.

Looking for support? Visit the forums, or join #drupal-support in IRC.


levsoroka’s picture

is it possible to modify atr on other components of the form? I was able to add attributes to email field. But what if I want to modify other components of the form.
For example I have name field. I tried following this convention but there was no result. THEMENAME_preprocess_webform_name.

Thank you

technicalknockout’s picture

Yes, you should be able to alter any component. I don't think there is any element 'webform_name'. What type of element are you trying to alter?

If you're not sure what the function should be called, try installing the Theme Developer module ( ). It could help you find the correct function naming convention. Also remember to clear your cache whenever you implement new hook/theme functions.

- - - -

levsoroka’s picture

it is just a regular textfield, another component of a webform that I have.

components (Array, 2 elements)

1 (Array, 11 elements)
nid (Integer) 6
cid (String, 1 characters ) 1
pid (String, 1 characters ) 0
form_key (String, 4 characters ) name
name (String, 4 characters ) name
type (String, 9 characters ) textfield
value (String, 0 characters )
extra (Array, 13 elements)
mandatory (String, 1 characters ) 1
weight (String, 1 characters ) 0
page_num (Integer) 1

2 (Array, 11 elements)
nid (Integer) 6
cid (String, 1 characters ) 2
pid (String, 1 characters ) 0
form_key (String, 5 characters ) email
name (String, 5 characters ) email
type (String, 5 characters ) email
value (String, 0 characters )
extra (Array, 10 elements)
mandatory (String, 1 characters ) 1
weight (String, 1 characters ) 1
page_num (Integer) 1

based on this webform node dsm I tried by type which is texfield, form key which is name and so on but no results.
I also tried suggested module, which gave me the same info practically

levsoroka’s picture

I tried mytheme_preprocess_textfield and that worked. Thank you for your suggestion. I think I am understanding the devel themer module better.
and drupal itself.
I will now apply some logic to only overwrite only necessary textfield.

Thank you

jfox77’s picture

For Drupal 7 you can use the Webform Hints module to use placeholder text instead of labels on your webforms. It worked like a charm for me!