在很多博客或者网站你们可能都会看到一些访客的评论被加上了各种等级的标志,有用插件的也有用代码的,这样有利于访客们为了争夺等级而积极留言,并且也让网站多了一些乐趣!这是怎么做到的呢?其实只需要修改几个文件就可以达到想要的那种效果了~

效果演示:http://www.nuomens.com/guestbook

第一步:functions.php 中添加模板函数

复制以下代码,把它添加到你主题的最后一个 「?>」 的上面即可:

//评论 VIP 标志
function get_author_class($comment_author_email,$comment_author_url){
global $wpdb;
$adminEmail = ‘nuomens@163.com’;
$author_count = count($wpdb->get_results(
“SELECT comment_ID as author_count FROM $wpdb->comments WHERE comment_author_email = ‘$comment_author_email’ “));
if($comment_author_email ==$adminEmail)
echo ‘<a class=”vp” title=” 本站认证,最高级别”></a>’;
$linkurls = $wpdb->get_results(
“SELECT link_url FROM $wpdb->links WHERE link_url = ‘$comment_author_url'”);
foreach ($linkurls as $linkurl) {
if ($linkurl->link_url == $comment_author_url )
echo ‘<a class=”vip” target=”_blank” href=”/guestbook/” title=” 合作商或友情链接认证”></a>’;
}
if($author_count>=1 && $author_count<10 && $comment_author_email!=$adminEmail)
echo ‘<a class=”vip1″ href=”/guestbook/” title=” 评论之星 LV.1″></a>’;
else if($author_count>=10 && $author_count<20 && $comment_author_email!=$adminEmail)
echo ‘<a class=”vip2″ href=”/guestbook/” title=” 评论之星 LV.2″></a>’;
else if($author_count>=20 && $author_count<50 && $comment_author_email!=$adminEmail)
echo ‘<a class=”vip3″ href=”/guestbook/” title=” 评论之星 LV.3″></a>’;
else if($author_count>=50 && $author_count<100 && $comment_author_email!=$adminEmail)
echo ‘<a class=”vip4″ href=”/guestbook/” title=” 评论之星 LV.4″></a>’;
else if($author_count>=100 &&$author_count<200 && $comment_author_email!=$adminEmail)
echo ‘<a class=”vip5″ href=”/guestbook/” title=” 评论之星 LV.5″></a>’;
else if($author_count>=200 && $author_coun<500 && $comment_author_email!=$adminEmail)
echo ‘<a class=”vip6″ href=”/guestbook/” title=” 评论之星 LV.6″></a>’;
else if($author_count>=500 && $comment_author_email!=$adminEmail)
echo ‘<a class=”vip7″ href=”/guestbook/” title=” 评论之星 LV.7″></a>’;
}

第二步:添加调用代码

一般在主题的 comments.php 里,找到<?php comment_author_link() ?> 并在其后加入如下代码即可:

<?php get_author_class($comment->comment_author_email,$comment->comment_author_url)?><?php if(user_can($comment->user_id, 1)){echo “<a title=’ 博主’ class=’vip’></a>”;}; ?>

第三步:添加 CSS 样式,直接 Copy 如下代码:

.vp,.vip,.vip1,.vip2,.vip3,.vip4,.vip5,.vip6,.vip7{background: url(images/vip.png) no-repeat;display: inline-block;overflow: hidden;border: none;}
.vp{background-position:-494px -3px;width: 16px;height: 16px;margin-bottom: -3px;}
.vp:hover{background-position:-491px -19px;width: 19px;height: 18px;margin-top: -3px;margin-left: -3px;margin-bottom: -3px;}
.vip{background-position:-515px -2px;width: 16px;height: 16px;margin-bottom: -3px;}
.vip:hover{background-position:-515px -22px;width: 16px;height: 16px;margin-bottom: -3px;}
.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;}
.btn-out,.btn-hover,.btn-down{background: url(images/vip.png) no-repeat;width: 64px;height: 23px;border:none;}
.btn-out{background-position:-659px -1px;}
.btn-hover{background-position:-724px -1px;}
.btn-down{background-position:-789px -1px;}
.input{border-radius: 1px 1px 1px 1px;border:1px solid #C5C5C5;background-color:#F6F6F6;}
.input:hover,.input:focus{background-color: white;border-color: #464646;}

第四步:保存下面的评论等级图标上传至主题目录下的 images 文件内即可。

vip

以上,试试吧,如果有任何问题或不会操作的,可以在下方留言,我会尽力解答。