• wordpress CMS主题:ssmay主题wordpress CMS主题:ssmay主题
  • 首页 > wordpress CMS主题制作 > wp主题如何在前台页面就可以给添加用户头像?

    wp主题如何在前台页面就可以给添加用户头像?

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

      wordpress默认的用户头像是采用gravatar头像,gravatar头像是会球公认头像,使用非常广,很多程序都用它。但是,它必须要要它的官网去注册,这对于一些普通用户来说就不太方便了。前段时间,有个Q友问我:“wp主题用户中心怎样在前端页面就可以添加自定义用户头像呢?” 这也就是我今天所要讲的内容。

      其实,wp主题要想实现在前台页面添加用户头像的功能,也不是个大难题,思路:我们可以给wordpress主题数据库添加一个用户自定义字段,然后把前台上传的图片保存到这个自定义字段中,在前台模板中需要用户头像的地方,就调用这个自定义字段就可以了。

      第一步:在wp主题用户中心的个人资料修改页面添加用户头像上传表单:

      <form action="" method="post" enctype="multipart/form-data">
      <!-- 用户图像 -->
      <div class="change-photo-btn">
      <div class="photoUpload">
         <span><i class="fa fa-upload"></i> 上传图像</span>
         <input type="file" class="upload" name="simple_local_avatar"/>
      </div>
      </div>

      这里的simple_local_avatar 就是用户头像自定义字段键名。注:上传图片的表单必须要加上enctype="multipart/form-data" 这个,没有这个就无法上传。

      第二步:在wp主题的functions.php文件中添加上传图片的处理函数代码:

      //图片上传函数:上传单张图片
      //参数1:图片信息; 参数2:存放图片路径
      function upload_image($info,$path){
      //获取图片后缀
      $pre = strrchr($info["name"],".");
      $img_name = date("YmdHis").$pre;
      //错误过滤
      if($info["error"]>0){
      switch($info["error"]){
      case 1: echo "文件大小超过php.ini设置的大小 2M。"; break;
      case 2: echo "文件大小超过表单设置的大小。"; break;
      case 3: echo "文件只有部分被上传。"; break;
      case 4: echo "没有文件被上传。"; break;
      case 6: echo "找不到临时文件夹。"; break;
      case 7: echo "文件写入失败。"; break;
      }
      echo '<script>alert("返回添加图片页面。"); window.history.back(); </script>';
      exit;
      }
      //图片类型过滤
      $pic_arr = array("image/jpeg","image/jpg","image/pjpeg","image/png","image/x-png","image/gif");
      if(!in_array($info["type"],$pic_arr)){
      echo '<script>alert("上传的文件必须是 jpg、png、gif格式的。"); window.history.back();</script>';
      exit;
      }
      //图片大小过滤
      if($info["size"]>(10*1024*1024)){
      echo '<script>alert("上传图片的大小不能超过 10M。"); window.history.back();</script>';
      exit;
      }
      if(is_uploaded_file($info["tmp_name"])){
      move_uploaded_file($info["tmp_name"],$path.$img_name);
      return $img_name;
      }
      }

      第三步:上传图片并保存到数据库:

      $path = WP_CONTENT_DIR.'/uploads/users_avagar/'; //在 uploads目录下创建一个 users_avagar目录
      if(!is_dir($path)){
      mkdir($path);
      }
      //组合 图片url
      $img_url['full'] = WP_CONTENT_URL.'/uploads/users_avagar/'.upload_image($files,$path);
      update_user_meta($uid,'simple_local_avatar',$img_url); //写入数据库

      通过上面的3步,我们就对wp主题实现了用户在前台页面就可以上传修改自定义头像了,然后在需要调用头像的地方,使用 get_user_meta() 方法来调用。不过,这种方法也有一个缺陷:就是没有跟gravatar头像调用方法通用,调用gravatar头像的方法:get_avatar() ,如查想使用get_avatar来调用我们这个自定义头像,可以添加一些判断处理,这里就不多做介绍了。



      QQ二维码

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

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

    或许你会感兴趣的文章:

    2条回应:“wp主题如何在前台页面就可以给添加用户头像?”

    1. lxmznm说道:

      教程是死的,
      人是活的,
      我们在学完教程后,
      要学会灵活应用,
      只有充分地掌握及灵活应用,
      才是我们学习的最终目的。

    2. wocaonima2008说道:

      要想实现在前台页面添加用户头像的功能,也不是个大难题

    发表评论

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

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