WordPress主题前台页面添加用户头像

发布时间:2020-02-23 整理:脚本之家
脚本之家收集整理的这篇文章主要介绍了WordPress主题前台页面添加用户头像脚本之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随脚本之家小编过来看看吧!

下面是脚本之家 jb51.cc 通过网络收集整理的代码片段。脚本之家小编现在分享给大家,也给大家做个参考。

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 来调用我们这个自定义头像,可以添加一些判断处理,这里就不多做介绍了。

以上是脚本之家(jb51.cc)为你收集整理的全部代码内容,希望文章能够帮你解决所遇到的程序开发问题。如果觉得脚本之家网站内容还不错,欢迎将脚本之家网站推荐给程序员好友。

总结

以上是脚本之家为你收集整理的WordPress主题前台页面添加用户头像全部内容,希望文章能够帮你解决WordPress主题前台页面添加用户头像所遇到的程序开发问题。

其他人正在看

如果觉得脚本之家网站内容还不错,欢迎将脚本之家网站推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您喜欢交流学习经验,点击链接加入脚本之家官方QQ群:1065694478
脚本之家官方公众号

微信公众号搜索 “ 程序精选 ” ,选择关注!

微信公众号搜索 “ 程序精选 ”
精选程序员所需精品干货内容!