Using hook_theme to modify Drupal forms
- 8 Comments
- Latest Comment
I’m going to show you how to use hook_theme to make some commonly requested changes to the Search form and the Comments form in Drupal 6. We’re also going to learn how this is done in your Genesis subtheme and the normal way of doing things. Take it as read the that the Genesis method also works for Zen sub-themes since the implementation of hook_theme for subthemes is the same.
Due to a rather hectic schedule this week at Adaptivethemes we’re we’re simply going to cut to the chase and deliver the snippets. If you have a question just leave a comment.
Before we start - take note of the differences between normal themes and Genesis/Zen subthemes:
- For normal themes place these snippets in your template.php file.
- For Genesis & Zen subthemes use the subthemes template.php file.
- The actual functions are the same for both methods, what differs the implementations of hook_theme.
- Replace MYTHEME or SUBTHEME with your themes name. Be aware of the Genesis method the theme naming.
- Don’t include the PHP tags, I use theme here to trigger syntax highlighting only.
Customising the Search Form
Q1. How to remove the “Search this site” label?
The most common answer to this is to use CSS to a do a display: none; which is OK except of course that it doesn’t completely remove it, but rather just hides it. The good thing about using CSS is that’s its quick to implement, but that’s about it.
Modify Drupals Search form using HOOK_theme()
Normal Drupal 6 way:
<?php
/**
* Implementation of HOOK_theme().
*/
function MYTHEME_theme(){
return array(
'search_theme_form' => array(
'arguments' => array('form' => NULL),
),
);
}
// The new theme function called by hook_theme
function MYTHEME_search_theme_form($form) {
// hide the label
$form['search_theme_form']['#title'] = NULL;
return drupal_render($form);
}
?>Genesis Subtheme way:
<?php
/**
* Implementation of HOOK_theme().
*/
function genesis_SUBTHEME_theme(&$existing, $type, $theme, $path) {
$hooks = genesis_theme($existing, $type, $theme, $path)
$hooks['search_theme_form'] = array(
'arguments' => array('form' => NULL),
);
return $hooks;
}
// The new theme function called by hook_theme
function genesis_SUBTHEME_search_theme_form($form) {
// hide the label
$form['search_theme_form']['#title'] = NULL;
return drupal_render($form);
}
?>Theme the Comment Form
What follows is stripped back version of the theme functions for this site. As you can see the Comment form has been modified somewhat to include some additional text, hide that dang input format list and various others things. Enough babbling - lets do it:
Modify Drupals Comment form using HOOK_theme()
Normal Drupal 6 way:
<?php
/**
* Implementation of HOOK_theme().
*/
function MYTHEME_theme(){
return array(
'comment_form' => array(
'arguments' => array('form' => NULL),
),
);
}
// theme the crap out of the comment form
function MYTHEME_comment_form($form) {
// Add some intro text.
$form['intro']['#value'] = t('<h3>Leave a comment, suggestion or ask a question!</h3>');
// Wrap the intro in a div for themeing.
$form['intro']['#prefix'] = '<div class="comment-guidelines">';
$form['intro']['#suffix'] = '</div>';
// Weight it so it floats to the top.
$form['intro']['#weight'] = -40;
// Make the text-area smaller.
$form['comment_filter']['comment']['#rows'] = 5;
// Change the text-area title
$form['comment_filter']['comment']['#title'] = t('Your message');
// Add a div wrapper for themeing.
$form['comment_filter']['comment']['#prefix'] = '<div class="comment-form-prefix">';
$form['comment_filter']['comment']['#suffix'] = '</div>';
// Remove input formats information.
$form['comment_filter']['format'] = NULL;
//dsm($form);
return drupal_render($form);
}
?>Genesis Subtheme way:
<?php
/**
* Implementation of HOOK_theme().
*/
function genesis_SUBTHEME_theme(&$existing, $type, $theme, $path) {
$hooks = genesis_theme($existing, $type, $theme, $path);
$hooks['comment_form'] = array(
'arguments' => array('form' => NULL),
);
return $hooks;
}
// theme the crap out of the comment form
function genesis_SUBTHEME_comment_form($form) {
// Add some intro text.
$form['intro']['#value'] = t('<h3>Leave a comment, suggestion or ask a question!</h3>');
// Wrap the intro in a div for themeing.
$form['intro']['#prefix'] = '<div class="comment-guidelines">';
$form['intro']['#suffix'] = '</div>';
// Weight it so it floats to the top.
$form['intro']['#weight'] = -40;
// Make the text-area smaller.
$form['comment_filter']['comment']['#rows'] = 5;
// Change the text-area title
$form['comment_filter']['comment']['#title'] = t('Your message');
// Add a div wrapper for themeing.
$form['comment_filter']['comment']['#prefix'] = '<div class="comment-form-prefix">';
$form['comment_filter']['comment']['#suffix'] = '</div>';
// Remove input formats information.
$form['comment_filter']['format'] = NULL;
//dsm($form);
return drupal_render($form);
}
?>Drupal Version:
Drupal Development:
Drupal:
Comments
#3 Can you elaborate on the last
Can you elaborate on the last two comments? Does the method described in this article not work with the CAPTCHA module for some reason? If so why? I’m trying to change the phrase “Post new comment” using a theme hook (?) for my Zen subtheme and it’s not working and I happen to be using the CAPTCHA module.
#4 thanks
Thanks for this post, this was really great. I wanted to remove “Anonmyous” as the default text in the name field so that an anonmyous poster would be forced to fill in the field (assuming that permissions are set up to require contact info). Adding this line did the trick. It didn’t seem to adversely affect things for logged in users.
$form[‘name’][‘value’] = t(”)’
#5 Hi i want to append extra characters to username field
i want to append extra characters to username field suppose in login page if user inputs ‘winner’ then before checking with db table user it should check “abc_winner” i:e in back i want to append “abc_” to the username given by user is this possible thru hook_theme
#6 I think I understand search example, but comment example?
Thanks for posting this, collegue directed me here for a theme-based alternative to hook_form_alter so I can implement image buttons on the forms. Awesome!
But I’m just trying to figure out the logic so I can make better use of hook_theme inside my themes…
- MYTHEME_theme() registers your functions with the Drupal Theme registry.
- MYTHEME_ function_ name() is now used whenever Drupal calls for theme(‘function_name’,…)
…but neither search_ theme_ form or comment_ form are rendered through something like theme(‘comment_ form’,…) but instead through drupal_ get_ form(). I looked at the drupal api, and drupal_ get_ form() calls drupal_ render() which seems to have some theme calls in it…is that where this is happening?
And by implementing MYTHEME_ search_ theme_ form, is Drupal now ignoring the search-theme-form.tpl.php file?
I’m probably missing something here…
Thanks!
#7 What am I missin
I would like my comments to look like yours (minus the formatting I guess). I added this and I still get the same, ugly text link that says:
Add new comment
Can you give some hint as to what went wrong?
#8 how do i get variables?
great text, very clear. question thou…
When i write code in function “mytheme_form_id” i would like to use $vars for setting some default values but $vars are not available in this function. My form is displayed directly in node template using node_add. Is there a way to alter form from preprocess node function?
#1 This is awsome!
Hi,
I am relatively new too drupal, is there a way to make this work with CAPTCHA module?
Thank you