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

跑了不少z-blog博客,其中一部分z-blog博客评论框有这么一个特效,当输入完邮箱地址后,在侧边立即会显示这个邮箱地址的Gavatar头像,很炫的功能,但一直没有研究。之后又在闲逛z-blog博客的时候,发现某z-blog博主编写了相关教程,博客吧就顺手转载过来给需要的博主吧。

实现z-blog留言输入邮箱立即显示gavatar的方法:

  1. 对当前z-blog主题模板文件b_article_commentpost.html进行编辑,在其中找到代码:
    1
    
    <input type="hidden" name="inpLocation" id="inpLocation" value="" />

    在其后面添加以下代码

    1
    2
    3
    
    <div id="gravatarNow"> 
    <img height="32" width="32" title="Gravatar头像" src="http://www.gravatar.com/avatar/"&t_mail_e&"?d=identicon&s=32&r=g"/> 
    </div>
  2. 再找到以下代码
    1
    
    <input type="text" name="inpEmail" id="inpEmail" class="text" value="" size="28" tabindex="2"/>

    将其替换为以下代码

    1
    
    <input type="text" name="inpEmail" id="inpEmail" class="text" value="" size="28" tabindex="2" onblur="getGravatarNow();"/>

    其中的onblur=”getGavatarNow();”表示判断语句来执行读取gavatar头像

  3. 下载immediatelyshowgavatar.zip压缩包,把压缩后的Gavatar.js文件和md5.js文件上传到当前主题SCRIPT目录下(没有就创建一个)
  4. 对single.html文件进行编辑,在</head>之前添加以下代码
    1
    2
    
    <script src="<#ZC_BLOG_HOST#>THEMES/<#ZC_BLOG_THEME#>/SCRIPT/gavatar.js" type="text/javascript"></script>
    <script src="<#ZC_BLOG_HOST#>THEMES/<#ZC_BLOG_THEME#>/SCRIPT/md5.js" type="text/javascript"></script>
  5. 在当前z-blog主题的css文件中添加以下css样式代码
    1
    2
    3
    4
    5
    6
    7
    8
    
    #gravatarNow{
      position:absolute;
      margin:0 0 0 480px
    }
    #gravatarNow img{
      border:1px solid #ddd;
      padding:2px
    }
  6. 保存文件后,重建文件即可。
    z-blog

参考原文

网友留言:

  1. 2014-12-02回复

    多说的也不错,只是要登陆。

    • 博主板凳
      2014-12-02回复

      现在用多说的人比较多。

      • 2014-12-03回复

        我的网站现在用的多说,刚刚建,还没有什么经验。

  2. 2012-11-05回复

    我设置了 不知道哪里有问题

  3. 2011-12-01回复

    我那天看了之后就去 添加这个功能 没想到 把zblog弄蹦了 第二天 我搞了一天才弄好 以后不敢随便动了

    • 博主板凳
      2011-12-01回复

      @情侣博客, 你弄之前把那两个文件备份,出问题一替换回去就可以了。

  4. 2011-11-29回复

    终于知道实现方式了,只是博客弄到现在不想再去做更改了,怕麻烦。。哈哈,博客吧兄在我博上的留言非常搞笑啊~

    • 博主板凳
      2011-11-29回复

      @犀利笔记, 喜欢折腾的可以玩玩哈。

  5. 2011-11-28回复

    我要用这个功能 呵呵

  6. 2011-11-27回复

    以前也是用zblog,后来发现功能太单调了
    换用wp

    • 博主板凳
      2011-11-28回复

      @突击军, 其实z-blog功能也挺强大的,只是少人去开发插件。

发表留言