Theming the Drupal 7 user registration form

I recently started my first Drupal 7 project, and one of the things I had to do was theme the user registration form. After doing a bit of searching, I came across several posts on the topic, and none of them were correct. However, thanks to some great suggestions here, I came up with the solution.

The first thing I needed was a custom module, implementing hook_form_FORM_ID_alter():

<?php
function MYMODULE_form_user_register_form_alter(&$form, &$form_state$form_id) {
  
$form['#theme'] = 'user_register';
}
?>

This was important, as the user registration form did not have a theme function associated with it.  The next step was to implement hook_theme() in my custom template.php:

<?php
function MYTHEME_theme($existing$type$theme$path){
  return array(
    
'user_register' => array(
      
'render element' => 'form',
      
'template' => 'templates/user-register',
    ),
  );
}
?>

This registers a theme function, defining a named variable and a template file to use. 

Next, I implemented a preprocess funtion in template.php, to set up a bunch of variables to output in my template.  I do this because I strongly dislike having function calls in my templates; in my opinion, template files should only contain markup and data, not perform any logic or fetch content.  A basic version of my preprocess function looks like this:

<?php
function MYTHEME_preprocess_user_register(&$variables) {
  
$variables['rendered'] = drupal_render_children($variables['form']);
}
?>

As you can see, I render the form, and store the rendered output in the $variables array.  Lastly, I created a template, named user-register.tpl.php, and it contains all of my themed markup for the user registration form.  The template can simply output the $rendered variable where I want:

<div class="some-class"><?php echo $rendered; ?></div>

Trackback URL for this post:

http://beyrent.net/trackback/387

Comments

Comment viewing options

Select your preferred way to display the comments and click "Save settings" to activate your changes.

celine Luggage Bag

All of celine bag, will be must-have pouch for everyone the whole set of time around! Gardening seasons come not to mention gardening seasons go, Celine Boogie Bag continues typically the must-have pouch if you are actually engaged in fashion.We tend to absolutely absolutely adore typically the Celine Box Bag.It happens to be quintessentially timeless not to mention tasteful.Celine luggage bag coffe might be created by unique form.The leading end accompanied by a nothing pocket and then a tassel.This unique form pouch would appear that a pouch smiling back to you, that will make a everyday contented.Celine Phantom Bag would appear that a pouch cheerful back to you, that will make a regular chuffed.Celine Purses turn out to be influenced by your recent type, hese neat and tidy most women leatherette billfolds are actually neat and tidy hove lined characteristic at the same time in the workplace not to mention for the duration of a leisurely activities celine back pack.The year 2010, best selling surge lighting and appliances Celine rewards from develop simpleness, triggering typically the extravagance Celine Tote Bag Heated, launched a wide array of chic not to mention transportable Tote Bag.

Facebook cover

I like this post very much, You have defined it very simply for so I understand what you say, In this post your writing level is also excellent to us.
Facebook cover

Hmm.. Is this real good, to

Hmm.. Is this real good, to define a theme function in a module, that is implemented in a theme? What happend, if theme doesn't exist, or not used in register page?
-------------
szantog

very helpful

Great, thank you so much for your sharing, i find the Mondule_theme function is so usefully ~

Glueless silk top yaki full lace wig

i tried this but user edit

i tried this but user edit form submit not works for me if i render fields instead of complete form

The Custom Module

When you created the custom module for your user registration form, did you save this module as a separate file with a particular file name? If so, what file name did you use and which directory did you place this file? I'm new to drupal, so there's a huge learning curve for me.

Thanks

michael kors outlet

By watched this article, I didn't reply immediately, since I fear my vulgar replies will compromise this such beautiful article. but I replied still, if I can't leave my name behind this such fascinating article, I will die with a grievance or everlasting regret! leaving my name behind this such matter, it is pride and honor for me! michael kors outlet forgive my selfish! I know there is no words can describe this gorgeous words regardless the fascinating degree of your article. so I would like to say only: your article is so good!

Article resource: http://www.michaelkorsoutletsfree.com/
super2012rjy02

I recently came across your blog and have been reading along.

I recently came across your blog and have been reading along. I thought I would leave my first comment. I don’t know what to say except that I have enjoyed reading. Nice blog. I will keep visiting this blog very often.

Coursework | Custom Assignment

thank you

thank you so much for this very useful post.

cheers!

Anyone themed drupal-commerce checkout form??

hi,
Anyone themed drupal-commerce checkout form??
I followed all the steps above to theme that form but no effect.
How i can render form elements individually?

Output individual elements

As others have noticed, it's not terribly useful to output the entire form into a variable only to print out the form in one go.

To get more control over the form, render each element individually adding markup as needed:

<?php
print drupal_render($form['form_build_id']);
print drupal_render($form['form_id']);
?>

<?php print drupal_render($form['account']['name']); // prints the username field ?>
<?php print drupal_render($form['account']['mail']); // prints the mail field ?>

<?php print drupal_render($form['submit']); // print the submit button ?>

Set a breakpoint in your IDE to see the values you can render that are held in $form.

You do not print submit

You do not print submit button with "print drupal_render($form['submit']);"
The right way in D7 is "print drupal_render($form['actions']['submit']);"

Thanks a lot for this. Very

Thanks a lot for this. Very clear, very useful, and it works. All other tutorials were for Drupal 6.

Thanks

Thanks Brother...it works.
Ravi Bhupendra kanojiya

Also

You can ignore all the instruction above and below, copy page.tpl.php to page--user--register.tpl.php on the base folder of your theme, and edit away... much simpler!

Note

You have to save the template to [your theme name]/templates/user-register.tpl.php

it work but how to submit

it work but how to submit that form , If i don't don't use <?php echo $rendered; ?>
validation is not working.
Thax

You do not need a extra module!

in your template.php you can add
function [YOUR-TEMPLATE-NAME]_form_user_register_form_alter(&$form, &$form_state, $form_id) {
$form['#theme'] = 'user_register';
}

if you do this you don't need a extra module ;-)

It works

I implemented your solution above and its work
thanks

Thanks for this explanation

Hi, Thank you for this explanation on what seems to be a thinly documented customization.

I implemented your solution above but have run into a very confusing issue. Form some reason, the user/register page does not pick up the user-register.tpl.php template...

The Module is operating (if I break the syntax the user/register page does not render)...

If there is anything you could suggest for how I troubleshoot this I would be forever grateful.

Thanks and again for a clear and needed tutorial.
Cheers,
Nick

but how to change markup?

ok, but how to change markup?
i want to remove default classes provided with standart drupal's contact form and replace it by my own classes.

i searched a lot, but cannot find any solution.

what now?

Your tutorial is very helpful and I have managed to set up the user-register.tpl.php.

So what I would like to do now is theme the page but I don't want to use all the classes that <?php print $rendered ?> outputs. I would also like to be able to re-arrange the elements of the form and change some of the labels that the form elements have. Then, finally, be able to properly submit the form.

How can I achieve this?

Post new comment

  • Web page addresses and e-mail addresses turn into links automatically.
  • Allowed HTML tags: <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd>
  • Lines and paragraphs break automatically.

More information about formatting options

About Erich

Erich is a web developer and a native New Englander who is passionate about life, the universe, and everything.

He is a Drupal consultant, previously employed as a senior developer at Harvard University, working on the IQSS OpenScholar project.  Prior to joining the team at Harvard, he was the engineering manager at CommonPlaces e-Solutions, in Hampstead, NH, contributing as the lead engineer on the Greenopolis.com and Twolia.com.

Erich is active in the Drupal community, having contributed modules and patches to the community. He presented at DrupalCon in Szeged Hungary, and co-presented at DrupalCon 2009 in Washington, DC.

Erich lives in New Hampshire with his wife, two sons, and three weimaraners.  When not writing code, Erich enjoys landscaping and woodworking.

Faceted search

Categories

Content type

Project types

Artwork Type

Artwork Tags

Recent comments

Activity Stream

August 29, 2011

August 25, 2011

August 24, 2011

August 23, 2011

August 15, 2011

August 11, 2011

August 10, 2011

August 9, 2011

August 4, 2011

August 3, 2011