On a recent project customer facing node add form had a design that required the description (help text) be just below the label, the default Drupal 7 implementation has it below the field which was not acceptable to my client. After quite extensive search i found few threads discussing it but it was hard to find the real solution, most of the Google results were regarding the CCK (drupal 6 version of fields module), other advised editing the core module files and then some were just incomplete… So as i did figure it out, i am sharing the solution with you (and possibly me, in few months when i forget how i did it…)
Open the template.php file of your theme and insert the below code at the end of the file:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 |
function EXAMPLE_THEME_form_element($variables) { $element = &$variables['element']; // This is also used in the installer, pre-database setup. $t = get_t(); // This function is invoked as theme wrapper, but the rendered form element // may not necessarily have been processed by form_builder(). $element += array( '#title_display' => 'before', ); // Add element #id for #type 'item'. if (isset($element['#markup']) && !empty($element['#id'])) { $attributes['id'] = $element['#id']; } // Add element's #type and #name as class to aid with JS/CSS selectors. $attributes['class'] = array('form-item'); if (!empty($element['#type'])) { $attributes['class'][] = 'form-type-' . strtr($element['#type'], '_', '-'); } if (!empty($element['#name'])) { $attributes['class'][] = 'form-item-' . strtr($element['#name'], array(' ' => '-', '_' => '-', '[' => '-', ']' => '')); } // Add a class for disabled elements to facilitate cross-browser styling. if (!empty($element['#attributes']['disabled'])) { $attributes['class'][] = 'form-disabled'; } $output = '<div' . drupal_attributes($attributes) . '>' . "\n"; // If #title is not set, we don't display any label or required marker. if (!isset($element['#title'])) { $element['#title_display'] = 'none'; } $prefix = isset($element['#field_prefix']) ? '<span class="field-prefix">' . $element['#field_prefix'] . '</span> ' : ''; $suffix = isset($element['#field_suffix']) ? ' <span class="field-suffix">' . $element['#field_suffix'] . '</span>' : ''; switch ($element['#title_display']) { case 'before': case 'invisible': $output .= ' ' . theme('form_element_label', $variables); if (!empty($element['#description'])) { $output .= '<div class="description">' . $element['#description'] . "</div>\n"; } $output .= ' ' . $prefix . $element['#children'] . $suffix . "\n"; break; case 'after': $output .= ' ' . $prefix . $element['#children'] . $suffix; $output .= ' ' . theme('form_element_label', $variables) . "\n"; $output .= ' ' . theme('form_element_label', $variables); if (!empty($element['#description'])) { $output .= '<div class="description">' . $element['#description'] . "</div>\n"; } break; case 'none': case 'attribute': // Output no label and no required marker, only the children. $output .= ' ' . $prefix . $element['#children'] . $suffix . "\n"; $output .= ' ' . theme('form_element_label', $variables); if (!empty($element['#description'])) { $output .= '<div class="description">' . $element['#description'] . "</div>\n"; } break; } $output .= "</div>\n"; return $output; } |
Don’t forget to replace the “EXAMPLE_THEME” with the name of your theme.
4 Comments. Leave new
Thanks for the code, works great for most fields except long text fields? Any idea?
Hi Jeremy, what happens when you use it with the long text fields?
Works for me, like a charm. Even for long text. Thanks a million.
I did experience doubled labels for multiple select items and found by removing the second line of the following, it solved the issue:
$output .= ' ' . theme('form_element_label', $variables) . "\n";
$output .= ' ' . theme('form_element_label', $variables);