• wordpress CMS主题:ssmay主题wordpress CMS主题:ssmay主题
  • 首页 > wordpress CMS主题制作 > wordpress主题自定义注册登录页面(2):创建自定义登录页面

    wordpress主题自定义注册登录页面(2):创建自定义登录页面

    作者: 分类:wordpress CMS主题制作 点击: 4,523 次
    wordpress CMS主题:ssmay主题

      上一章我们介绍了wordpress主题自定义注册页面的制作过程,要章我们接着给主题创建一个自定义登录页面,让用户不需通过wordpress程序默认的登录页面登录后台。wordpress主题自定义登录页面在一定程序上,也能提升一个wordpress主题折层次,比如一些要求相对较高的商业主题。嗯,下面就一起来看一下怎么制作wordpress自定义登录页面吧。

      首先在主题文件夹下创建一个登录文件page-login.php,用dreamweaver打开这个文件,添加页面定义代码:

      <?php
      /*
      Template Name: 登陆页面
      */

      然后,添加判断用户是否登录代码:

      global $wpdb,$user_ID;

      if (!$user_ID) { //判断用户是否登录
      //接下来的代码都添加在这里

      }else { //跳转到首页
      echo "<script type='text/javascript'>window.location='". get_bloginfo('url') ."'</script>";
      }

      接着添加验证数据代码,如下:

      if($_POST){ //数据提交
      //We shall SQL escape all inputs
      $username = $wpdb->escape($_REQUEST['username']);
      $password = $wpdb->escape($_REQUEST['password']);
      $remember = $wpdb->escape($_REQUEST['rememberme']);

      if($remember){
      $remember = "true";
      } else {
      $remember = "false";
      }
      $login_data = array();
      $login_data['user_login'] = $username;
      $login_data['user_password'] = $password;
      $login_data['remember'] = $remember;
      $user_verify = wp_signon( $login_data, false );
      //wp_signon 是wordpress自带的函数,通过用户信息来授权用户(登陆),可记住用户名

      if ( is_wp_error($user_verify) ) {
      echo "<span class='error'>用户名或密码错误,请重试!</span>";//不管啥错误都输出这个信息
      exit();
      } else { //登陆成功则跳转到首页(ajax提交所以需要用js来跳转)
      echo "<script type='text/javascript'>window.location='". get_bloginfo('url') ."'</script>";
      exit();
      }
      } else {

      //这里添加登录表单代码

       

      }

       

      然后,在上面的代码中的“ //这里添加登录表单代码”添加如下代码:

      get_header();//载入头部文件
      ?>
      <!--<script src="http://code.jquery.com/jquery-1.4.4.js"></script>--><!--如果你发现没有ajax提交,请检查是否有引入jquery.js文件-->
      <div id="container">
      <div id="content">
      <h3>阿树工作室-登陆页面</h3>
      <div id="result"></div> <!-- 输出结果 -->
      <form id="wp_login_form" action="" method="post">
      <label>用户名</label><br />
      <input type="text" name="username" class="text" value="" /><br />
      <label>密码</label><br />
      <input type="password" name="password" class="text" value="" /> <br />
      <label>
      <input name="rememberme" type="checkbox" value="forever" />记住我</label>
      <br /><br />
      <input type="submit" id="submitbtn" name="submit" value="Login" />
      </form>

      <script type="text/javascript"><!--ajax 提交数据-->
      $("#submitbtn").click(function() {
      <!--请准备一个gif图-->
      $('#result').html('<img src="<?php bloginfo('template_url'); ?>/images/loader.gif" class="loader" />').fadeIn();
      var input_data = $('#wp_login_form').serialize();
      $.ajax({
      type: "POST",
      url: "<?php echo "http://" . $_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI']; ?>",
      data: input_data,
      success: function(msg){
      $('.loader').remove();
      $('<div>').html(msg).appendTo('div#result').hide().fadeIn('slow');
      }
      });
      return false;

      });
      </script>

      </div>
      </div>
      <?php
      get_footer(); //载入底部文件

      表单代码一定要放在最后一个大括号前面哦。好了,这样我们就制作好了wordpress自定义登录页面。



      QQ二维码

    文章作者:高时银博客
    本文地址:http://wanlimm.com/77201506084299.html
    版权所有 © 转载时必须以链接形式注明作者和原始出处!

    上一篇:
    下一篇:
    wordpress CMS主题:ssmay主题

    或许你会感兴趣的文章:

    发表评论

    电子邮件地址不会被公开。 必填项已用*标注

    This site uses Akismet to reduce spam. Learn how your comment data is processed.