WordPress给来访的盆友们添加评论头衔

  • 内容
  • 评论
  • 相关

这几天在各个博客四处闲逛的时候,看到很多博客的评论下大家都有自己的头衔,又想到了自己之前的hexo博客(缅怀多说=-=),就想在Wordpress实现下这样的功能,google了一下,发现有篇相关文章《纯代码实现WordPress评论VIP标志的等级功能》,简单改了改代码,就实现啦!

下面简单说下步骤:

1、打开自身主题的函数文件(比一般情况下是functions.php),将以下代码扔到最后一个?>的前面:

function get_author_class($comment_author_email, $user_id){
global $wpdb;
$author_count = count($wpdb->get_results(
"SELECT comment_ID as author_count FROM $wpdb->comments WHERE comment_author_email = '$comment_author_email' "));
if($author_count>=1 && $author_count<= 10 )//数字可自行修改,代表评论次数。
echo '<span class="vip1">LV.1</span>';
else if($author_count>=11 && $author_count<= 20)
echo '<span class="vip2">LV.2</span>';
else if($author_count>=21 && $author_count<= 40)
echo '<span class="vip3">LV.3</span>';
else if($author_count>=41 && $author_count<= 80)
echo '<span class="vip4">LV.4</span>';
else if($author_count>=81 && $author_count<= 160)
echo '<span class="vip5">LV.5</span>';
else if($author_count>=161 && $author_count<= 320)
echo '<span class="vip6">LV.6</span>';
else if($author_count>=321)
echo '<span class="vip7">LV.7</span>';
}

PS:author_count的界限可自行修改,它代表着来访者的评论次数。

2、添加css样式

这边罗列了部分css样式,大家可根据自己喜好自行修改

.vip {
background: #0bf;
border-radius: 15px;
padding: 5px;
color: white;
}
.vip1 {
background: pink;
border-radius: 15px;
padding: 5px;
color: white;
}
.vip2 {
background: rgb(255, 102, 97);
border-radius: 15px;
padding: 5px;
color: white;
}
.night-mode .vip, .night-mode .vip1, .night-mode .vip2 {
background: #999;
color: black;
}

3、调用代码

<?php 
if ($comment->user_id == '1') {
echo '<span class="vip">萌萌哒博主</span>';
}else{
echo get_author_class($comment->comment_author_email,$comment->user_id);
}
?>

将这段调用代码扔到需要显示的地方,需要注意的是comment->user_id代表用户的id,如果博客的管理员不止一个或删掉了最开始时候建站时的管理员账户,可能就需要自行修改里面的id的值了。

因为我们一般都是想要它在评论者昵称后面显示,所以常规上的位置,则是写在functions.php/comments.php(视主题而定)里<?php comment_author_link() ?>的后面。

至此就大功告成啦!效果如下:

PS:前排出售本站称号啦~名额有限,先到先得!

评论

18条评论
  1. Gravatar 头像

    Leonn 渣渣~ 回复

    Google Chrome 56 | Windows 10

    好东西呀~

    • Gravatar 头像

      Shawn 萌萌哒博主 回复

      Safari 10 | Mac OS X 10.12

      ~

  2. Gravatar 头像

    香菇 传说 回复

    Maxthon 5 | Windows 10

    很好很强大

    • Gravatar 头像

      Shawn 萌萌哒博主 回复

      Safari 10 | Mac OS X 10.12

      哈哈多谢

  3. Gravatar 头像

    小莫 潜水 回复

    Sogou Explorer | Windows 7

    谢谢,很强势

  4. Gravatar 头像

    MR WHY 潜水 回复

    Google Chrome 58 | Mac OS X 10.12

    缅怀多说 +1
    PS:喜欢打字时候跳出来的色彩哈哈哈哈哈哈哈忍不住多敲字。

    • Gravatar 头像

      Shawn 萌萌哒博主 回复

      Safari 10 | Mac OS X 10.12

      https://pan.baidu.com/s/1i4HbCYp
      去下载下这个js然后再加下这段代码就行啦!

      <script>
      POWERMODE.colorful = true; // make power mode colorful  
      POWERMODE.shake = false; // turn off shake  
      document.body.addEventListener('input', POWERMODE);
      </script>
      
      • Gravatar 头像

        MR WHY 潜水 回复

        Google Chrome 58 | Mac OS X 10.12

        好的,多谢!

  5. Gravatar 头像

    monsterlin 潜水 回复

    Google Chrome 58 | Mac OS X 10.12

    哈哈,你的这个输入框交互很帅呀,打起很舒服,比之前打一下,网页闪动的好很多很多

    • Gravatar 头像

      Shawn 萌萌哒博主 回复

      Safari 10 | Mac OS X 10.12

      你看你楼上~照着做就行

  6. Gravatar 头像

    无人小站 潜水 回复

    Firefox 53 | Windows 10

    :mrgreen: 看起来不错就是好像得了多动症一样动来动去😂

    • Gravatar 头像

      Shawn 萌萌哒博主 回复

      Safari 10 | Mac OS X 10.12

      啥?

      • Gravatar 头像

        潜水 回复

        Yandex Browser 17 | Windows 10

        就是说你的评论框各种抖动特效加太多了🤷

        • Gravatar 头像

          Shawn 萌萌哒博主 回复

          Safari 10 | Mac OS X 10.12

          ……

  7. Gravatar 头像

    顾念 潜水 回复

    QQbrowser 9 | Windows 7

    dalao能给下wp获取浏览器类型和客户端类型吗,网上的都不全

    • Gravatar 头像

      Shawn 萌萌哒博主 回复

      Safari 10 | Mac OS X 10.12

      我直接用的插件……WP-UserAgent

      • Gravatar 头像

        顾念 潜水 回复

        QQbrowser 9 | Windows 7

        谢了

发表评论

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