firoze

Custom Login/Register/Password Code

Mar 12th, 2015
484
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 8.97 KB | None | 0 0
  1. // custome login template
  2.  
  3.  
  4. <div id="login-register-password">
  5.  
  6. <?php global $user_ID, $user_identity; get_currentuserinfo(); if (!$user_ID) { ?>
  7.  
  8. <ul class="tabs_login">
  9. <li class="active_login"><a href="#tab1_login">Login</a></li>
  10. <li><a href="#tab2_login">Register</a></li>
  11. <li><a href="#tab3_login">Forgot?</a></li>
  12. </ul>
  13. <div class="tab_container_login">
  14. <div id="tab1_login" class="tab_content_login">
  15.  
  16. <?php $register = $_GET['register']; $reset = $_GET['reset']; if ($register == true){ ?>
  17.  
  18. <h3>Success!</h3>
  19. <p>Check your email for the password and then return to log in.</p>
  20.  
  21. <?php } elseif ($reset == true) { ?>
  22.  
  23. <h3>Success!</h3>
  24. <p>Check your email to reset your password.</p>
  25.  
  26. <?php } else { ?>
  27.  
  28. <h3>Have an account?</h3>
  29. <p>Log in or sign up! It&rsquo;s fast &amp; <em>free!</em></p>
  30.  
  31. <?php } ?>
  32.  
  33. <form method="post" action="<?php bloginfo('url') ?>/wp-login.php" class="wp-user-form">
  34. <div class="username">
  35. <label for="user_login"><?php _e('Username'); ?>: </label>
  36. <input type="text" name="log" value="<?php echo esc_attr(stripslashes($user_login)); ?>" size="20" id="user_login" tabindex="11" />
  37. </div>
  38. <div class="password">
  39. <label for="user_pass"><?php _e('Password'); ?>: </label>
  40. <input type="password" name="pwd" value="" size="20" id="user_pass" tabindex="12" />
  41. </div>
  42. <div class="login_fields">
  43. <div class="rememberme">
  44. <label for="rememberme">
  45. <input type="checkbox" name="rememberme" value="forever" checked="checked" id="rememberme" tabindex="13" /> Remember me
  46. </label>
  47. </div>
  48. <?php do_action('login_form'); ?>
  49. <input type="submit" name="user-submit" value="<?php _e('Login'); ?>" tabindex="14" class="user-submit" />
  50. <input type="hidden" name="redirect_to" value="<?php echo esc_url( $_SERVER['PHP_SELF'] ); ?>" />
  51. <input type="hidden" name="user-cookie" value="1" />
  52. </div>
  53. </form>
  54. </div>
  55. <div id="tab2_login" class="tab_content_login" style="display:none;">
  56. <h3>Register for this site!</h3>
  57. <p>Sign up now for the good stuff.</p>
  58. <form method="post" action="<?php echo site_url('wp-login.php?action=register', 'login_post') ?>" class="wp-user-form">
  59. <div class="username">
  60. <label for="user_login"><?php _e('Username'); ?>: </label>
  61. <input type="text" name="user_login" value="<?php echo esc_attr(stripslashes($user_login)); ?>" size="20" id="user_login" tabindex="101" />
  62. </div>
  63. <div class="password">
  64. <label for="user_email"><?php _e('Your Email'); ?>: </label>
  65. <input type="text" name="user_email" value="<?php echo esc_attr(stripslashes($user_email)); ?>" size="25" id="user_email" tabindex="102" />
  66. </div>
  67. <div class="login_fields">
  68. <?php do_action('register_form'); ?>
  69. <input type="submit" name="user-submit" value="<?php _e('Sign up!'); ?>" class="user-submit" tabindex="103" />
  70. <?php $register = $_GET['register']; if($register == true) { echo '<p>Check your email for the password!</p>'; } ?>
  71. <input type="hidden" name="redirect_to" value="<?php echo esc_url( $_SERVER['PHP_SELF'] ); ?>?register=true" />
  72. <input type="hidden" name="user-cookie" value="1" />
  73. </div>
  74. </form>
  75. </div>
  76. <div id="tab3_login" class="tab_content_login" style="display:none;">
  77. <h3>Lose something?</h3>
  78. <p>Enter your username or email to reset your password.</p>
  79. <form method="post" action="<?php echo site_url('wp-login.php?action=lostpassword', 'login_post') ?>" class="wp-user-form">
  80. <div class="username">
  81. <label for="user_login" class="hide"><?php _e('Username or Email'); ?>: </label>
  82. <input type="text" name="user_login" value="" size="20" id="user_login" tabindex="1001" />
  83. </div>
  84. <div class="login_fields">
  85. <?php do_action('login_form', 'resetpass'); ?>
  86. <input type="submit" name="user-submit" value="<?php _e('Reset my password'); ?>" class="user-submit" tabindex="1002" />
  87. <?php $reset = $_GET['reset']; if($reset == true) { echo '<p>A message will be sent to your email address.</p>'; } ?>
  88. <input type="hidden" name="redirect_to" value="<?php echo esc_url( $_SERVER['PHP_SELF'] ); ?>?reset=true" />
  89. <input type="hidden" name="user-cookie" value="1" />
  90. </div>
  91. </form>
  92. </div>
  93. </div>
  94.  
  95. <?php } else { // is logged in ?>
  96.  
  97. <div class="sidebox">
  98. <h3>Welcome, <?php echo $user_identity; ?></h3>
  99. <div class="usericon">
  100. <?php global $userdata; get_currentuserinfo(); echo get_avatar($userdata->ID, 60); ?>
  101.  
  102. </div>
  103. <div class="userinfo">
  104. <p>You&rsquo;re logged in as <strong><?php echo $user_identity; ?></strong></p>
  105. <p>
  106. <a href="<?php echo wp_logout_url('index.php'); ?>">Log out</a> |
  107. <?php if (current_user_can('manage_options')) {
  108. echo '<a href="' . admin_url() . '">' . __('Admin') . '</a>'; } else {
  109. echo '<a href="' . admin_url() . 'profile.php">' . __('Profile') . '</a>'; } ?>
  110.  
  111. </p>
  112. </div>
  113. </div>
  114.  
  115. <?php } ?>
  116.  
  117. </div>
  118.  
  119.  
  120.  
  121. // custom login js
  122.  
  123. <script type="text/javascript" charset="utf-8">
  124. jQuery(document).ready(function() {
  125. jQuery(".tab_content_login").hide();
  126. jQuery("ul.tabs_login li:first").addClass("active_login").show();
  127. jQuery(".tab_content_login:first").show();
  128. jQuery("ul.tabs_login li").click(function() {
  129. jQuery("ul.tabs_login li").removeClass("active_login");
  130. jQuery(this).addClass("active_login");
  131. jQuery(".tab_content_login").hide();
  132. var activeTab = jQuery(this).find("a").attr("href");
  133. if (jQuery.browser.msie) {jQuery(activeTab).show();}
  134. else {jQuery(activeTab).show();}
  135. return false;
  136. });
  137. });
  138. </script>
  139.  
  140.  
  141. // custom login template css
  142.  
  143.  
  144. /* tabbed list */
  145. ul.tabs_login {
  146. padding: 0; margin: 20px 0 0 0;
  147. position: relative;
  148. list-style: none;
  149. font-size: 14px;
  150. z-index: 1000;
  151. float: left;
  152. }
  153. ul.tabs_login li {
  154. border: 1px solid #E7E9F6;
  155. -webkit-border-top-right-radius: 10px;
  156. -khtml-border-radius-topright: 10px;
  157. -moz-border-radius-topright: 10px;
  158. border-top-right-radius: 10px;
  159. -webkit-border-top-left-radius: 10px;
  160. -khtml-border-radius-topleft: 10px;
  161. -moz-border-radius-topleft: 10px;
  162. border-top-left-radius: 10px;
  163. line-height: 28px; /* = */ height: 28px;
  164. padding: 0; margin: 0 5px 0 0;
  165. position: relative;
  166. background: #fff;
  167. overflow: hidden;
  168. float: left;
  169. }
  170. ul.tabs_login li a {
  171. text-decoration: none;
  172. padding: 0 10px;
  173. display: block;
  174. outline: none;
  175. }
  176. html ul.tabs_login li.active_login {
  177. border-left: 1px solid #E7E9F6;
  178. border-bottom: 1px solid #fff;
  179. -webkit-border-top-right-radius: 10px;
  180. -khtml-border-radius-topright: 10px;
  181. -moz-border-radius-topright: 10px;
  182. border-top-right-radius: 10px;
  183. -webkit-border-top-left-radius: 10px;
  184. -khtml-border-radius-topleft: 10px;
  185. -moz-border-radius-topleft: 10px;
  186. border-top-left-radius: 10px;
  187. background: #fff;
  188. color: #333;
  189. }
  190. html body ul.tabs_login li.active_login a { font-weight: bold; }
  191. .tab_container_login {
  192. background: #fff;
  193. position: relative;
  194. margin: 0 0 20px 0;
  195. border: 1px solid #E7E9F6;
  196. -webkit-border-bottom-left-radius: 10px;
  197. -khtml-border-radius-bottomleft: 10px;
  198. -moz-border-radius-bottomleft: 10px;
  199. border-bottom-left-radius: 10px;
  200. -webkit-border-bottom-right-radius: 10px;
  201. -khtml-border-radius-bottomright: 10px;
  202. -moz-border-radius-bottomright: 10px;
  203. border-bottom-right-radius: 10px;
  204. -webkit-border-top-right-radius: 10px;
  205. -khtml-border-radius-topright: 10px;
  206. -moz-border-radius-topright: 10px;
  207. border-top-right-radius: 10px;
  208. z-index: 999;
  209. float: left;
  210. width: 100%;
  211. top: -1px;
  212. }
  213. .tab_content_login {
  214. padding: 7px 15px 15px 15px;
  215. padding-top: 10px;
  216. }
  217. .tab_content_login ul {
  218. padding: 0; margin: 0 0 0 15px;
  219. }
  220. .tab_content_login li { margin: 5px 0; }
  221. /* global styles */
  222. #login-register-password {}
  223. #login-register-password h3 {
  224. border: 0 none;
  225. margin: 10px 0;
  226. padding: 0;
  227. }
  228. #login-register-password p {
  229. margin: 0 0 15px 0;
  230. padding: 0;
  231. }
  232. /* form elements */
  233. .wp-user-form {}
  234. .username, .password, .login_fields {
  235. margin: 7px 0 0 0;
  236. overflow: hidden;
  237. width: 100%;
  238. }
  239. .username label, .password label { float: left; clear: none; width: 25%; }
  240. .username input, .password input {
  241. font: 12px/1.5 "Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif;
  242. float: left; clear: none; width: 200px; padding: 2px 3px; color: #777;
  243. }
  244. .rememberme { overflow: hidden; width: 100%; margin-bottom: 7px; }
  245. #rememberme { float: left; clear: none; margin: 4px 4px -4px 0; }
  246. .user-submit { padding: 5px 10px; margin: 5px 0; }
  247. .userinfo { float: left; clear: none; width: 75%; margin-bottom: 10px; }
  248. .userinfo p {
  249. margin-left: 10px;
  250. }
  251. .usericon { float: left; clear: none; width: 15%; margin: 0 0 10px 22px; }
  252. .usericon img {
  253. border: 1px solid #F4950E;
  254. padding: 1px;
  255. }
  256.  
  257.  
  258.  
  259. // source link:http://digwp.com/2010/12/login-register-password-code/
Advertisement
Add Comment
Please, Sign In to add comment