Theming Drupal forms

posted by Ishmael Sanchez on Apr 30, 2011

Theming Drupal forms can be tricky because the form API provides so much flexibility it's sort of overwhelming for a designer or themer. Pretty much there are three approaches to theming forms: CSS, theme level, or module.

CSS

Ok you don't have much power here since you are left with whatever HTML was generated by your theme or other modules. However, with some creative CSS you can create a form layout and make it look pretty squared away. Check out this post on modifying a form with just CSS, Webform CSS.

Theme level

Theme level is where you can go crazy and modify the form output. You can wrap or organize forms using attributes like #prefix, #suffix, #weight and #markup. You can also use hook_theme in your template.php file, you can preprocess and if you like use a template file for your forms. In Drupal 7 you can use hook_form_alter in your template.php file.

Module

If you already have a custom module on your site it might make sense to use hook_form_alter to modify the output of your form. Also if the output of the the form should be independent of the theme then it's probably best to use a module since any theme overrides won't be applied if the theme is disabled.

Resources

Post new comment

  • Allowed HTML tags: <em> <strong> <cite> <code> <ul> <ol> <li>
  • Lines and paragraphs break automatically.

More information about formatting options

By submitting this form, you accept the Mollom privacy policy.

Ishmael Sanchez