[SOLVED] [Drupal Webform] Altering a Webform's submit button to an image causes it to stop working

October 22, 2012 - 14:50

Styling a Webform is more or less like styling any other ordinary HTML form. Often you would like to change the style of the submit button and replace it with an image via code in your Drupal website. Although this is extremely easy it might cause the button to stop working, forcing it to reload and fail to show the confirmation message. If you are facing this problem while styling your Webform in your Drupal website read on to find the solution.

Follow the steps to make your Webform submit button working after styling it

  • Copy and paste the following code into your custom module or create a custom module and paste this code there.

/**
* Change webform standard button to image button.
*/
function your_module_form_alter(&$form, &$form_state, $form_id) {
  if ($form_id == 'webform_client_form_123') {    
	   $form['actions']['submit']['#type'] = 'image_button';
	   $form['actions']['submit']['#src'] = base_path() . drupal_get_path('theme', 'your_theme') . '/images/your_image_name.jpg';
	   $form['actions']['submit']['#name'] = 'op';	
	 
  }
}
  • Make sure that you replace the placeholders in the code with the appropriate names of your module, Webform, theme and the image name when you execute it.
  • Hope that helps.

    The easiest way to solve a Drupal issue is to hand it to the Drupal experts. We offer Drupal support and other Drupal services to help you maintain and manage your Drupal websites. Get in touch with us to know more.

    Get Drupal updates straight to your inbox

    To prevent automated spam submissions leave this field empty.

    Post your comments / questions

    Thank you so much for the guide! It's excellent.
    Maybe it's too much to ask for more but let me try :)
    Extending this guide, is it possible that when I build a webform, I upload a submit image and the path to this particular image is automatically used for the submit button of that webform?