实现 Z-Blog 留言输入邮箱立即显示Gavatar头像

实现 Z-Blog 留言输入邮箱立即显示Gavatar头像

Z-Blog 是一款非常受欢迎的开源博客程序，具有灵活、强大、稳定等特点，使用简单、便捷。提供了非常丰富的插件功能和主题支持，同时其自带的留言板块功能也受到了广大博主的喜爱。

问题分析：

Z-Blog 的留言板块功能可以让访问者轻松地留下评论或者意见，但是在留言时需要输入邮箱，访问者输入邮箱后，头像并不会立即显示，需要等待管理员审核后才会显示，这样会给访问者带来不便，降低用户体验。

解决方案：

1. 方案一：使用 Gravatar 服务

Gravatar 是一个网站头像服务，只要在 Gravatar 官网设置好你的邮箱地址和头像，那么在支持 Gravatar 的网站上，只需要输入同样的邮箱地址，你的头像就会显示出来。

// 1. 在Z-Blog后台插件中心搜索 Gravatar 头像，下载并安装该插件；

// 2. 在头像设置中选择“Gravatar 头像”，选项后保存设置。

// 注意：使用 Gravatar 头像时，需要保证 Z-Blog 域名与 Gravatar 网站上设置的域名一致

2. 方案二：使用 JS 实现

通过 JS 实现邮箱输入框失去焦点后立即显示头像，但是需要向 Gravatar 官网请求头像。

1. 通过 JS 获取输入框中的邮箱；

2. 使用 MD5 将邮箱地址转换为 Gravatar 网站的 URI 地址；

3. 创建一个 img 标签，将上一步生成的地址赋值给 src 属性；

4. 在页面中插入该 img 标签，即可显示头像。