I tried to create a custom form registration a while ago using wordpress. I wanted to register several custom fields and make them required so I tried to find the right plugin instead of reinventing the wheel.
I found a good plugin called theme my login: http://wordpress.org/plugins/theme-my-login/
You will need to read a bit to do this, but lucky us there's documentation that can help you on this website:
See here how to add extra registration fields:
http://www.jfarthing.com/development/theme-my-login/adding-extra-registration-fields/
Basically you need to:
1) Install the plugin
2) Add register-form.php into your theme layout.
3) Modify your copy of your register-form.php For something like this:
<div class="login" id="theme-my-login<?php $template->the_instance(); ?>">
<?php $template->the_action_template_message( 'register' ); ?>
<?php $template->the_errors();
?>
<form name="registerform" id="registerform<?php $template->the_instance(); ?>" action="<?php $template->the_action_url( 'register' ); ?>" method="post" autocomplete = "off">
<input type="text" name="user_login" id="user_login<?php $template->the_instance(); ?>" class="input" value="<?php $template->the_posted_value( 'user_login' ); ?>" size="20" />
<input type="text" name="user_email" id="user_email<?php $template->the_instance(); ?>" class="input" value="<?php $template->the_posted_value( 'user_email' ); ?>" size="20" />
<input type="text" placeholder="Gender" name="user_gender" id="user_gender<?php $template->the_instance(); ?>" value="<?php $template->the_posted_value( 'user_gender' ); ?>" required />
<input type="text" placeholder="City" type="text" id="user_city<?php $template->the_instance(); ?>" name="user_city" value="<?php $template->the_posted_value( 'user_city' ); ?>"/>
<?php do_action( 'register_form' ); ?>
<p class="submit">
<input type="submit" name="wp-submit" class="yellow btn1 uppercase right os700" id="wp-submit<?php $template->the_instance(); ?>" value="<?php esc_attr_e( '[ Submit ]' ); ?>" />
<input type="hidden" name="redirect_to" value="<?php $template->the_redirect_url( 'register' ); ?>" />
<input type="hidden" name="instance" value="<?php $template->the_instance(); ?>" />
<input type="hidden" name="action" value="register" />
</p>
</form>
<?php $template->the_action_links( array( 'register' => false ) ); ?>
Here you can modify and add custom fields and as much HTML and CSS as you want/need.
Then on your functions.php
you will need to register a couple of actions so you here we go.
To register the user:
function tml_user_register( $user_id ) {
if ( !empty( $_POST['user_login'] ) )
update_user_meta( $user_id, 'user_login', $_POST['user_login'] );
if ( !empty( $_POST['user_email'] ) )
update_user_meta( $user_id, 'user_email', $_POST['user_email'] );
if ( !empty( $_POST['user_gender'] ) )
update_user_meta( $user_id, 'user_gender', $_POST['user_gender'] );
if ( !empty( $_POST['user_city'] ) )
update_user_meta( $user_id, 'user_city', $_POST['user_city'] );
}
add_action( 'user_register', 'tml_user_register' );`
To display the content on the dashboard:
add_action ( 'show_user_profile', 'my_show_extra_profile_fields' );
add_action ( 'edit_user_profile', 'my_show_extra_profile_fields' );
With these two actions you can display your user profiles on your dashboard so add this in your functions.php as well.
<?php function my_show_extra_profile_fields ( $user ){ ?>
<h3>Custom profile information</h3>
<table class="form-table">
<tr>
<th><label for="user_gender"><?php _e('Gender');?></label></th>
<td><input type="text" name="user_gender" id="user_gender" value="<?php echo esc_attr( get_the_author_meta( 'user_gender', $user->ID ) ); ?>" /><br /></td>
</tr>
<tr>
<th><label for="user_city"><?php _e('City');?></label></th>
<td><input type="text" name="user_city" id="user_city" value="<?php echo esc_attr( get_the_author_meta( 'user_city', $user->ID ) ); ?>" /><br /></td>
</tr>
</table>
<?php }
If you want to let the users update their own info add something like this (also in your functions.php):
add_action ( 'personal_options_update', 'my_save_extra_profile_fields' );
add_action ( 'edit_user_profile_update', 'my_save_extra_profile_fields' );
function my_save_extra_profile_fields( $user_id ){
if ( !current_user_can( 'edit_user', $user_id ) )
return false;
update_usermeta( $user_id, 'user_gender', esc_attr(trim($_POST['user_gender'])) );
update_usermeta( $user_id, 'user_city', esc_attr(trim($_POST['user_city'])) );
}
Is quite a lot, but useful have a go, read the documentation and good luck, hope this helps you.
EDITED
Ok so if you want to show the user meta you can use the author.php and the profile-form.php located in the templates
folder, as well as with the register-form.php other files you can copy this file into your theme folder and customise.
To display the custom meta on your author.php
add the following shortcode:
echo do_shortcode('[theme-my-login default_action="profile" show_title="1"]');
Then you can show the content using something like this:
echo $profileuser->user_city
echo $profileuser->user_gender