Custom Login/Register/Password Code

Here is the code to display the login/register/password form anywhere in your theme:

<!-- Theme Template Code -->

<div id="login-register-password">

<?php global $user_ID, $user_identity; get_currentuserinfo(); if (!$user_ID) { ?>

<ul>
<li><a href="#tab1_login">Login</a></li>
<li><a href="#tab2_login">Register</a></li>
<li><a href="#tab3_login">Forgot?</a></li>
</ul>
<div>
<div id="tab1_login">

<?php $register = $_GET['register']; $reset = $_GET['reset']; if ($register == true) { ?>

<h3>Success!</h3>
<p>Check your email for the password and then return to log in.</p>

<?php } elseif ($reset == true) { ?>

<h3>Success!</h3>
<p>Check your email to reset your password.</p>

<?php } else { ?>

<h3>Have an account?</h3>
<p>Log in or sign up! It&rsquo;s fast &amp; <em>free!</em></p>

<?php } ?>

<form method="post" action="<?php bloginfo('url') ?>/wp-login.php">
<div>
<label for="user_login"><?php _e('Username'); ?>: </label>
<input type="text" name="log" value="<?php echo esc_attr(stripslashes($user_login)); ?>" size="20" id="user_login" tabindex="11" />
</div>
<div>
<label for="user_pass"><?php _e('Password'); ?>: </label>
<input type="password" name="pwd" value="" size="20" id="user_pass" tabindex="12" />
</div>
<div>
<div>
<label for="rememberme">
<input type="checkbox" name="rememberme" value="forever" checked="checked" id="rememberme" tabindex="13" /> Remember me
</label>
</div>
<?php do_action('login_form'); ?>
<input type="submit" name="user-submit" value="<?php _e('Login'); ?>" tabindex="14" />
<input type="hidden" name="redirect_to" value="<?php echo $_SERVER['REQUEST_URI']; ?>" />
<input type="hidden" name="user-cookie" value="1" />
</div>
</form>
</div>
<div id="tab2_login" style="display:none;">
<h3>Register for this site!</h3>
<p>Sign up now for the good stuff.</p>
<form method="post" action="<?php echo site_url('wp-login.php?action=register', 'login_post') ?>">
<div>
<label for="user_login"><?php _e('Username'); ?>: </label>
<input type="text" name="user_login" value="<?php echo esc_attr(stripslashes($user_login)); ?>" size="20" id="user_login" tabindex="101" />
</div>
<div>
<label for="user_email"><?php _e('Your Email'); ?>: </label>
<input type="text" name="user_email" value="<?php echo esc_attr(stripslashes($user_email)); ?>" size="25" id="user_email" tabindex="102" />
</div>
<div>
<?php do_action('register_form'); ?>
<input type="submit" name="user-submit" value="<?php _e('Sign up!'); ?>" tabindex="103" />
<?php $register = $_GET['register']; if($register == true) { echo '<p>Check your email for the password!</p>'; } ?>
<input type="hidden" name="redirect_to" value="<?php echo $_SERVER['REQUEST_URI']; ?>?register=true" />
<input type="hidden" name="user-cookie" value="1" />
</div>
</form>
</div>
<div id="tab3_login" style="display:none;">
<h3>Lose something?</h3>
<p>Enter your username or email to reset your password.</p>
<form method="post" action="<?php echo site_url('wp-login.php?action=lostpassword', 'login_post') ?>">
<div>
<label for="user_login"><?php _e('Username or Email'); ?>: </label>
<input type="text" name="user_login" value="" size="20" id="user_login" tabindex="1001" />
</div>
<div>
<?php do_action('login_form', 'resetpass'); ?>
<input type="submit" name="user-submit" value="<?php _e('Reset my password'); ?>" tabindex="1002" />
<?php $reset = $_GET['reset']; if($reset == true) { echo '<p>A message will be sent to your email address.</p>'; } ?>
<input type="hidden" name="redirect_to" value="<?php echo $_SERVER['REQUEST_URI']; ?>?reset=true" />
<input type="hidden" name="user-cookie" value="1" />
</div>
</form>
</div>
</div>

<?php } else { // is logged in ?>

<div>
<h3>Welcome, <?php echo $user_identity; ?></h3>
<div>
<?php global $userdata; get_currentuserinfo(); echo get_avatar($userdata->ID, 60); ?>

</div>
<div>
<p>You&rsquo;re logged in as <strong><?php echo $user_identity; ?></strong></p>
<p>
<a href="<?php echo wp_logout_url('index.php'); ?>">Log out</a> |
<?php if (current_user_can('manage_options')) {
echo '<a href="' . admin_url() . '">' . __('Admin') . '</a>'; } else {
echo '<a href="' . admin_url() . 'profile.php">' . __('Profile') . '</a>'; } ?>

</p>
</div>
</div>

<?php } ?>

</div>

Okay, so here are the functional highlights for this hefty chunk of code:

  • Everything is wrapped with <div id=”login-register-password”></div>
  • If the user is not logged in, the three forms are included in the markup
  • If the user is logged in, a simple welcome message is displayed
  • Success messages are displayed after both password recovery and registration
  • Each form submission sets a generic user-cookie
  • After login or registration, the script redirects the user to the same page
  • Only one form is shown at a time; JavaScript is used to show and hide forms

So if you just throw this thing into your sidebar.php file, you’ll see the login form and three links: login, register, and recover-password. The other two forms are included in the markup, but are hidden with CSS. As-is, the three links won’t do anything because they require JavaScript to work. Once we sprinkle in some jQuery, the links will toggle the three different forms.

First let’s walk through using this code in your theme.

  1. Place the custom login code in your sidebar.php file, or some other location
  2. Grab the jQuery code (no-conflict mode) and include it in your footer.php file
  3. Include the CSS code in your theme’s style.css file, or wherever your styles are located

..and done. Once these three items are in place, upload everything to your server and check it out.

for detail tutorial you can vsit http://digwp.com/2010/12/login-register-password-code/