今天闲着没事便将自己网站的评论区稍作了些修改，这次主要修改的内容是在评论者旁边添加了VIP星级标识以及博主认证标识，其中VIP星级标识是根据评论数量来进行评级的，下面我就将这次修改的主要内容整理如下，有需要这方面功能的朋友可以了解一下。下面是我修改后的样式：

这次修改的文件主要是DUX主题的functions.php、main.css与mo_comments_list.php文件，为了防止修改过程中产生的一些错误，建议大家在修改文件之前把这几个文件备份一下。

添加星级图片文件

在修改主题文件前，希望大家先把所需要的图片文件上传至主题目录的img文件夹下，或者你也可以上传到其他文件夹下，不过要记住文件的路径，后面要用到。

functions.php文件修改

将以下代码添加到主题的functions.php文件中，注意代码内容添加至?>前。

// WordPress 添加评论之星
 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' "));
 // 如果不需要管理员显示VIP标签，就把下面一行的 // 去掉
 // $adminEmail = get_option('admin_email');if($comment_author_email ==$adminEmail) return;
 if($author_count>=1 && $author_count<20)
 echo '<a class="vip1" title="评论达人 LV.1"></a>';
 else if($author_count>=20 && $author_count<40)
 echo '<a class="vip2" title="评论达人 LV.2"></a>';
 else if($author_count>=40 && $author_count<80)
 echo '<a class="vip3" title="评论达人 LV.3"></a>';
 else if($author_count>=80 && $author_count<160)
 echo '<a class="vip4" title="评论达人 LV.4"></a>';
 else if($author_count>=160 && $author_count<320)
 echo '<a class="vip5" title="评论达人 LV.5"></a>';
 else if($author_count>=320 && $author_count<640)
 echo '<a class="vip6" title="评论达人 LV.6"></a>';
 else if($author_count>=640)
 echo '<a class="vip7" title="评论达人 LV.7"></a>';
}

mo_comments_list.php文件

mo_comments_list.php文件是DUX主题评论区的核心文件，其他主题修改的话可能需要修改主题文件夹下的comments.php文件，具体请询问主题开发者。对于DUX主题，使用查找工具在mo_comments_list.php文件中找到如下语句：

echo '<div class="comt-meta"><span class="comt-author">'.get_comment_author_link().'</span>';

具体位置应该是在文件的第57行处，找到后在文件的第58行末尾添加如下语句：

get_author_class($comment->comment_author_email,$comment->user_id); if($comment->user_id == 1){echo "&nbsp<a title='博主' class='vip'></a>&nbsp";};

添加完成后第58行的完整代码应为：

echo _get_time_ago($comment->comment_date); get_author_class($comment->comment_author_email,$comment->user_id); if($comment->user_id == 1){echo "&nbsp<a title='博主' class='vip'></a>&nbsp";};

main.css文件修改

由于DUX主题没有调用style.css文件，所以如果我们按照其他教程将CSS样式添加到主题文件夹下的style.css文件里是无法调用CSS样式的，你需要将下面的代码添加到主题设置的“自定义CSS样式”代码框中或者是主题的main.css文件才可以执行。

/*VIP评论之星*/
.vp,.vip,.vip1,.vip2,.vip3,.vip4,.vip5,.vip6,.vip7{background: url(../img/vip.png) no-repeat;display: inline-block;overflow: hidden;border: none;}
.vp{background-position:-515px -2px;width: 16px;height: 16px;margin-bottom: -3px;}
.vp:hover{background-position:-515px -22px;width: 16px;height: 16px;margin-bottom: -3px;}
.vip{background-position:-494px -3px;width: 16px;height: 14px;margin-bottom: -2px;}
.vip:hover{background-position:-494px -22px;width: 16px;height: 14px;margin-bottom: -2px;}
.vip1{background-position:-1px -2px;width: 46px;height: 14px;margin-bottom: -1px;}
.vip1:hover{background-position:-1px -22px;width: 46px;height: 14px;margin-bottom: -1px;}
.vip2{background-position:-63px -2px;width: 46px;height: 14px;margin-bottom: -1px;}
.vip2:hover{background-position:-63px -22px;width: 46px;height: 14px;margin-bottom: -1px;}
.vip3{background-position:-144px -2px;width: 46px;height: 14px;margin-bottom: -1px;}
.vip3:hover{background-position:-144px -22px;width: 46px;height: 14px;margin-bottom: -1px;}
.vip4{background-position:-227px -2px;width: 46px;height: 14px;margin-bottom: -1px;}
.vip4:hover{background-position:-227px -22px;width: 46px;height: 14px;margin-bottom: -1px;}
.vip5{background-position:-331px -2px;width: 46px;height: 14px;margin-bottom: -1px;}
.vip5:hover{background-position:-331px -22px;width: 46px;height: 14px;margin-bottom: -1px;}
.vip6{background-position:-441px -2px;width: 46px;height: 14px;margin-bottom: -1px;}
.vip6:hover{background-position:-441px -22px;width: 46px;height: 14px;margin-bottom: -1px;}
.vip7{background-position:-611px -2px;width: 46px;height: 14px;margin-bottom: -1px;}
.vip7:hover{background-position:-611px -22px;width: 46px;height: 14px;margin-bottom: -1px;}

需要注意的是，上面代码中的url参数对于不同的主题可能需要进行相应的变动。当然，对于DUX主题的main.css文件，保持../img/vip.png不变即可。