腾讯云服务器优惠活动华纳云香港服务器
boke112百科 » WordPress » 正文

如何实现多作者的WordPress站点经验值排行榜

更新于 2016-11-15 12:22:32首发于 2016-11-16 07:13:10557
WordPress主题推荐

前几天boke112导航推出了投稿作者等级及相应福利，其中涉及到一个就是经验值排行榜，很多博主站长都想了解这个排行榜是如何实现的，所以今天boke112特意将这个实现方法分享给大家，希望集合大家的智慧进一步优化这个代码。

如何实现多作者的WordPress站点经验值排行榜-第1张-boke112百科(boke112.com)

准备工作：

  • 懂得建立自定义页面（不懂的请移步：《如何建立WordPress自定义页面》）；
  • 想好作者等级及经验值是如何计算的；
  • 安装有统计阅读数的插件WP-PostViews，如果是其他方式统计浏览数，请自行修改第一步的代码。

多作者的WordPress站点经验值排行榜实现方法：

1、打开自定义页面（如排行榜页面）模板，找到以下代码：

  1. <?php the_content(); ?>

然后在它下方添加以下代码：

  1. <div id=“zzphbbg”  style=“text-align:center;vertical-align:middle;”>
  2. <table width=“100%”>
  3. <tbody>
  4. <tr>
  5. <td width=“10%”><strong>排名</strong></td>
  6. <td width=“20%”><strong>作者</strong></td>
  7. <td width=“10%”><strong>等级</strong></td>
  8. <td width=“20%”><strong>经验值</strong></td>
  9. <td width=“10%”><strong>文章数</strong></td>
  10. <td width=“20%”><strong>阅读数</strong></td>
  11. <td width=“10%”><strong>评论数</strong></td>
  12. </tr>
  13.     <?php
  14.     global $wpdb, $post;
  15.     $zzphb = ”;
  16.     $zuozhe_viewed = $wpdb->get_results(“SELECT count($wpdb->posts.ID) as wzzs,sum($wpdb->posts.comment_count) as plzs, sum(meta_value+0) AS ydzs,(count($wpdb->posts.ID)*100+sum(meta_value+0)+sum($wpdb->posts.comment_count)*5) as jyz,$wpdb->posts.post_author as userid FROM $wpdb->posts LEFT JOIN $wpdb->postmeta ON $wpdb->postmeta.post_id = $wpdb->posts.ID WHERE post_author!=’1′ AND post_status = ‘publish’ AND meta_key = ‘views’ AND post_password = ” GROUP BY userid order by jyz DESC”);
  17.     if($zuozhe_viewed) {
  18.         $i = 0;
  19.         foreach ($zuozhe_viewed as $post) {
  20.             $zzwzs = $post->wzzs;
  21.             $zzydzs = $post->ydzs;
  22.             $zzplzs = $post->plzs;
  23.             $zzjyz = $post->jyz;
  24.             $i++;
  25.             $zznc = get_the_author_meta( ‘nickname’, $post->userid);
  26.             if($zzjyz>=1 && $zzjyz<10000){$zzdj='<a class=“vip1” title=“作者等级LV.1为基础级，距离下级还差’.(10000-$zzjyz).'”></a><br/>【基础级】’;}
  27.             if($zzjyz>=10000 && $zzjyz<100000){$zzdj='<a class=“vip2” title=“作者等级LV.2为入门级，距离下级还差’.(100000-$zzjyz).'”></a><br/>【入门级】’;}
  28.             if($zzjyz>=100000 && $zzjyz<500000){$zzdj='<a class=“vip3” title=“作者等级LV.3为职业级，距离下级还差’.(500000-$zzjyz).'”></a><br/>【职业级】’;}
  29.             if($zzjyz>=500000 && $zzjyz<1000000){$zzdj='<a class=“vip4” title=“作者等级LV.4为大神级，距离下级还差’.(1000000-$zzjyz).'”></a><br/>【大神级】’;}
  30.             if($zzjyz>=1000000){$zzdj='<a class=“vip5” title=“作者等级LV.5为宗师级”></a><br/>【宗师级】’;}
  31.             if ($i == 1) {
  32.             $tt = “<i class=’novel-rank-icon novel-rank-1′></i>”;
  33.         }
  34.         else if ($i == 2) {
  35.             $tt = “<i class=’novel-rank-icon novel-rank-2′></i>”;
  36.         }
  37.         else if ($i == 3) {
  38.             $tt = “<i class=’novel-rank-icon novel-rank-3′></i>”;
  39.         }
  40.         else {
  41.             $tt = $i;
  42.         }
  43.             $zzphb .= “<tr><td width=’10%’><span class=’fz16 red’>$tt</span></td>
  44. <td width=’20%’><span class=’fz16 red’><a href=\”https://boke112.com/page/author/”. $post->userid . “/\” title=\””. $zznc . “在boke112导航的专栏\” rel=\”nofollow\” target=\”_blank\”>$zznc</a></span></td>
  45. <td width=’10%’><span class=’fz16 red’>$zzdj</span></td>
  46. <td width=’20%’><span class=’fz16 red’>$zzjyz</span></td>
  47. <td width=’10%’><span class=’fz16 red’>$zzwzs</span></td>
  48. <td width=’20%’><span class=’fz16 red’>$zzydzs</span></td>
  49. <td width=’10%’><span class=’fz16 red’>$zzplzs</span></td>
  50. </tr>”;
  51.         }
  52.     }
  53.     echo $zzphb;
  54. ?>
  55. </tbody>
  56. </table>
  57. </div>

其中，代码中的作者等级及对应的经验值请自行修改，经验值计算代码：

  1. (count($wpdb->posts.ID)*100+sum(meta_value+0)+sum($wpdb->posts.comment_count)*5)

的意思是作者文章总数乘以100加上文章总阅读加上文章总评论数乘以5。其中的倍数或经验值计算方式请自行修改。

2、添加以下CSS代码到主题的style.css文件中

  1. #zzphbbg td{text-align:center;vertical-align:middle;}
  2. .novel-rank-icon {
  3.     width: 17px;
  4.     height: 22px;
  5.     display: inline–block;
  6.     background-image: url(images/zzdj.png);
  7.     background-repeat: no-repeat;
  8. }
  9. .novel-rank-icon.novel-rank-1 {
  10.     background-position: 0 0;
  11. }
  12. .novel-rank-icon.novel-rank-2 {
  13.     background-position: 0 –36px;
  14. }
  15. .novel-rank-icon.novel-rank-3 {
  16.     background-position: 0 –74px;
  17. }
  1. /*作者VIP等级显示功能的样式*/
  2. .vp,.vip,.vip1,.vip2,.vip3,.vip4,.vip5,.vip6,.vip7{background: url(images/vip.png) no-repeat;display: inline–block;overflow: hidden;border: none;}
  3. .vp{background-position:-515px –2px;width: 16px;height: 16px;margin-bottom: –3px;}
  4. .vp:hover{background-position:-515px –22px;width: 16px;height: 16px;margin-bottom: –3px;}
  5. .vip{background-position:-494px –3px;width: 16px;height: 14px;margin-bottom: –2px;}
  6. .vip:hover{background-position:-494px –22px;width: 16px;height: 14px;margin-bottom: –2px;}
  7. .vip1{background-position:-1px –2px;width: 46px;height: 14px;margin-bottom: –1px;}
  8. .vip1:hover{background-position:-1px –22px;width: 46px;height: 14px;margin-bottom: –1px;}
  9. .vip2{background-position:-63px –2px;width: 46px;height: 14px;margin-bottom: –1px;}
  10. .vip2:hover{background-position:-63px –22px;width: 46px;height: 14px;margin-bottom: –1px;}
  11. .vip3{background-position:-144px –2px;width: 46px;height: 14px;margin-bottom: –1px;}
  12. .vip3:hover{background-position:-144px –22px;width: 46px;height: 14px;margin-bottom: –1px;}
  13. .vip4{background-position:-227px –2px;width: 46px;height: 14px;margin-bottom: –1px;}
  14. .vip4:hover{background-position:-227px –22px;width: 46px;height: 14px;margin-bottom: –1px;}
  15. .vip5{background-position:-331px –2px;width: 46px;height: 14px;margin-bottom: –1px;}
  16. .vip5:hover{background-position:-331px –22px;width: 46px;height: 14px;margin-bottom: –1px;}
  17. .vip6{background-position:-441px –2px;width: 46px;height: 14px;margin-bottom: –1px;}
  18. .vip6:hover{background-position:-441px –22px;width: 46px;height: 14px;margin-bottom: –1px;}
  19. .vip7{background-position:-611px –2px;width: 46px;height: 14px;margin-bottom: –1px;}
  20. .vip7:hover{background-position:-611px –22px;width: 46px;height: 14px;margin-bottom: –1px;}

3、将以下图片存放到主题的images文件夹中，如果不是这个文件夹，注意修改CSS代码中的图片路径哦。

如何实现多作者的WordPress站点经验值排行榜-第2张-boke112百科(boke112.com)

如何实现多作者的WordPress站点经验值排行榜-第3张-boke112百科(boke112.com)

总结

其实这个排行榜的实现方法就跟我们那些读者墙的实现方法差不多，通过SQL语句查询出相应的数据后展示出来即可，剩下的就是调整一下CSS样式而已。如果担心通过SQL实时查询显示数据有压力，或担心被别人刷数据，可以为这个排行榜页面增加一个验证码之类的，只有验证码正确后才可以显示。具体怎么折腾就看大家的想法了，本文只是以boke112导航的投稿作者排行榜来说明一下思路而已。

本文地址：https://boke112.com/post/3647.html

赞 (0) 打赏
版权声明：本文为原创文章，版权归 boke112百科 所有，欢迎分享本文，转载请保留出处！发布此文是出于传递更多信息之目的，若有来源标注错误或侵犯了您的合法权益，请联系我们，确认后马上更正或删除，谢谢！
标签

相关文章

最新文章

免备案外贸虚拟主机SiteGround

热门标签

Copyright © boke112百科基于 WordPress + YIA 构建桂ICP备14004711号-3anbei桂公网安备 45010502000016号
wu