前言
刚才在隔壁看到《WordPress使用AJAX实时获取评论头像》,我就想typecho是不是也能实现这个功能呢!
看了《WordPress使用AJAX实时获取评论头像》这个文章后,我理解到,它实际就是给模板内置了个api,通过ajax请求这个api来实时获取邮箱头像地址。懂了原理就简单了
PHP部分
此代码添加到主题functions.php文件
function themeInit($archive)
{
if(isset($_GET['action']) == 'ajax_avatar_get' && 'GET' == $_SERVER['REQUEST_METHOD'] ) {
$host = 'https://secure.gravatar.com/avatar/';
$email = strtolower( $_GET['email']);
$hash = md5($email);
$sjtx = 'mm';
$avatar = $host . $hash . '?d='.$sjtx;
echo $avatar;
die();
}else { return; }
}
如果你的模板已经添加过了themeInit
,那么只要向themeInit
内部添加if部分即可。
JS部分
此代码添加到主题js文件
$("input#email").blur(function() {
var _email = $(this).val();
if (_email != '') {
$.ajax({
type: 'GET',
data: {
action: 'ajax_avatar_get',
form: ajaxurl, // 修改为你的Ajax路径
email: _email
},
success: function(data) {
$('.avatar').attr('src', data); // 修改为你自己的头像标签
}
}); // end ajax
}
return false;
});
代码中的input#email
和.avatar
需要根据自己的模板进行适当修改,代码中的ajaxurl
可以直接写自己博客地址,或者当前文章地址也行,可以用js获取地址,也可以直接写死。
后语
其实除了php部分和WordPress稍有不同外,其他没什么不同,js部分直接抄自《WordPress使用AJAX实时获取评论头像》。
版权属于:泽泽社长
本文链接:https://blog.zezeshe.com/archives/typecho-ajax-avatar.html
本站未注明转载的文章均为原创,并采用
CC BY-NC-SA 4.0 授权协议,转载请注明来源,谢谢!
突然想搞这个 过来考古
我记得我博客没这功能 但实际上有……
哈哈,我博客应该还有填写邮箱自动获取昵称啥啊功能
不会搞 早就看到这个功能了
看一下
在paul的Fantasy主题下,不能用啊,按照代码修改后头像框只是一个破损的图片的形状,发表评论后,评论区的头像也还是系统默认的头像,大佬直到怎么改吗?
你可以让paul加嘛
JS部分第8行,是干什么用的呢?
form: ajaxurl, // 修改为你的Ajax路径
显示报错 Notice: Undefined index
也许是哪里你操作不当
是if( $_GET['action']少了个isset ,if( isset($_GET['action'])这样子就不会报错了
感谢提醒
其实还可以直接利用这个接口跳转过去,不用 Ajax 都可以
大佬好,在你的Fantasy主题下,不能用啊,按照代码修改后头像框只是一个破损的图片的形状,发表评论后,评论区的头像也还是系统默认的头像,想请教下该怎么改?
你这个APP侧栏的捐赠功能是怎么做的呀?
在前端做这事情的我。。用的 blueimp-md5 库在前端计算邮箱的哈希值。。
用api比较神秘嘛
这个很牛逼
js文件在哪?
新建然后引入或者直接加到现有的js里