老谢博客

  • 首页
  • WordPress
  • 网络技术
  • 乱七八糟
  • 运维技术
  • 给我留言
  • 关于老谢

wordpress读者墙血条版-感谢无冷大湿

分类:折腾日期:2011-06-21 - 19:53:02作者:老谢

参考地址:http://icold.me/readerswall-blood/

今天把读者墙折腾出来了,演示http://www.xj123.info/readerswall

感谢@无冷大湿

css部分如下:

#readerswall li{width:40px;height:46px;margin:0 10px 10px 0;padding:5px;
float:left;list-style:none;border: 1px solid #DFDFDF;
-moz-border-radius:2px;-khtml-border-radius: 2px;
-webkit-border-radius: 2px;border-radius: 2px;}
#readerswall img{width:40px;height:40px;display:block;}
#readerswall .active-bg{width:40px;height:2px;_font-size:0;margin-top:5px;background:#DFDFDF; }
#readerswall .active-degree{background:#08c;width:40px;height:2px;_font-size:0;}

#readerswall li{width:40px;height:46px;margin:0 10px 10px 0;padding:5px; float:left;list-style:none;border: 1px solid #DFDFDF; -moz-border-radius:2px;-khtml-border-radius: 2px; -webkit-border-radius: 2px;border-radius: 2px;} #readerswall img{width:40px;height:40px;display:block;} #readerswall .active-bg{width:40px;height:2px;_font-size:0;margin-top:5px;background:#DFDFDF; } #readerswall .active-degree{background:#08c;width:40px;height:2px;_font-size:0;}

 

页面模板代码:

<?php
    $query="SELECT COUNT(comment_ID) AS cnt, comment_author, comment_author_url, comment_author_email FROM (SELECT * FROM $wpdb->comments LEFT OUTER JOIN $wpdb->posts ON ($wpdb->posts.ID=$wpdb->comments.comment_post_ID) WHERE comment_date > date_sub( NOW(), INTERVAL 24 MONTH ) AND user_id='0' AND comment_author_email != '这里填admin的email,不显示该email的头像' AND post_password='' AND comment_approved='1' AND comment_type='') AS tempcmt GROUP BY comment_author_email ORDER BY cnt DESC LIMIT 40";//最后的这个40是选取多少个头像,我一次让它显示40个。
    $wall = $wpdb->get_results($query);
    $maxNum = $wall[0]->cnt;
    foreach ($wall as $comment) 
    {
        $width = round(40 / ($maxNum / $comment->cnt),2);//这个40是我设置头像的宽度,和下面&size=40里的40一个概念,如果你头像宽度32,这里就是32了。
        if( $comment->comment_author_url ) 
        $url = $comment->comment_author_url;
        else $url="#";
        $tmp = "<li title='".$comment->comment_author." (".$comment->cnt."次重要讲话)' num='".$comment->cnt."'><a href='".$comment->comment_author_url."' target='_blank'><img src='http://www.gravatar.com/avatar.php?gravatar_id=".md5($comment->comment_author_email)."&size=40&d=identicon&r=G' alt='" . $comment->comment_author . " (". $comment->cnt . "层楼)' /></a><div class='active-bg'><div class='active-degree' style='width:".$width."px'></div></li>";
        $output .= $tmp; 
     }
    $output = "<div id='readerswall'><h2>Most Active Friends</h2><ul class='gavaimg'>".$output."</ul></div>";
    echo $output ;
?>

<?php $query="SELECT COUNT(comment_ID) AS cnt, comment_author, comment_author_url, comment_author_email FROM (SELECT * FROM $wpdb->comments LEFT OUTER JOIN $wpdb->posts ON ($wpdb->posts.ID=$wpdb->comments.comment_post_ID) WHERE comment_date > date_sub( NOW(), INTERVAL 24 MONTH ) AND user_id='0' AND comment_author_email != '这里填admin的email,不显示该email的头像' AND post_password='' AND comment_approved='1' AND comment_type='') AS tempcmt GROUP BY comment_author_email ORDER BY cnt DESC LIMIT 40";//最后的这个40是选取多少个头像,我一次让它显示40个。 $wall = $wpdb->get_results($query); $maxNum = $wall[0]->cnt; foreach ($wall as $comment) { $width = round(40 / ($maxNum / $comment->cnt),2);//这个40是我设置头像的宽度,和下面&size=40里的40一个概念,如果你头像宽度32,这里就是32了。 if( $comment->comment_author_url ) $url = $comment->comment_author_url; else $url="#"; $tmp = "<li title='".$comment->comment_author." (".$comment->cnt."次重要讲话)' num='".$comment->cnt."'><a href='".$comment->comment_author_url."' target='_blank'><img src='http://www.gravatar.com/avatar.php?gravatar_id=".md5($comment->comment_author_email)."&size=40&d=identicon&r=G' alt='" . $comment->comment_author . " (". $comment->cnt . "层楼)' /></a><div class='active-bg'><div class='active-degree' style='width:".$width."px'></div></li>"; $output .= $tmp; } $output = "<div id='readerswall'><h2>Most Active Friends</h2><ul class='gavaimg'>".$output."</ul></div>"; echo $output ; ?>

把页面模板上传到主题目录,然后建立一个页面,选择上传的模板

wordpress读者墙血条版-感谢无冷大湿

大功告成了,看看效果吧

原文地址 : https://www.xj123.info/1471.html

本站遵循 : 署名-非商业性使用-相同方式共享 2.5 中国大陆 (CC BY-NC-SA 2.5)

版权声明 : 原创文章转载时,请务必以超链接形式标明文章原始出处

Tags: 读者墙
  • 上一篇:VTP实验笔记
  • 下一篇:页面载入中……
5条评论
  1. 80后向前冲 说:

    请问这个读者墙如何设置为显示最近一个月的读者的血条呢?

    POST:2011-10-18 11:06 回复
    • 老谢 说:

      @80后向前冲 直接Email 无冷

      POST:2011-10-18 11:33 回复
      • 80后向前冲 说:

        哦,好滴,谢啦~~呵呵~~

        POST:2011-10-18 12:12 回复
  2. suliuer 说:

    强大。

    POST:2011-10-25 20:13 回复
  3. 偶看 说:

    演示效果在哪里啊。

    POST:2012-09-26 17:21 回复
    • 老谢 说:

      @偶看 换了主题,后来没上读者墙了

      POST:2012-09-29 20:57 回复
  4. 骑行领域 说:

    话说我还纳闷怎么读者墙没了,原来换主题了。代码就这点儿不好,换主题,效果就消失了。

    POST:2012-11-06 18:01 回复
  5. 狂奔的蜗牛 说:

    试试~~~~ 多谢分享

    POST:2012-11-06 22:26 回复
1 2
发表评论 点击取消评论.

*必填

*必填

  • 文章归档
  • 子网计算
  • 我的共享
  • 锻炼计划
  • 给我留言
  • 关于老谢
2025 年 6 月
一 二 三 四 五 六 日
 1
2345678
9101112131415
16171819202122
23242526272829
30  
« 5 月    

最新文章

  • 认知,是否是一座大山?当架构决策变成配置清单比价
  • 重装博客服务器环境
  • 特斯拉24款标续 Model Y 2万公里使用体验
  • 接盘的傻子
  • 小牛us电瓶指示灯闪三次不上电
  • 一次还不错的小米售后体验
  • 装台1600元办公主机
  • 2021好久没更新博客
  • Zabbix监控oxidized备份状态
  • Zabbix 5.0 LTS版本MySQL表分区及编译安装随记

最新评论

  • zwwooooo:类似以前做网站开发时,一开始有自...
  • 老陳网志:有点高端,像我们整点nas玩玩就够...
  • springwood:自从 CentOS 不维护之后,我换 U...
  • 大D:难都搞下来了,那就更得YM了
  • 大D:只能是YM了,谢总牛啊
  • 灰常记忆:经济不好 今年我也换了机器 一...
  • 大峰:这是海外服务器嘛?速度挺快的。
  • 大D:只能单走一个6了哈哈哈
  • zwwooooo:买特斯拉和买iPhone的人群其实相似...
  • 平安家属子痕:一直坚持油车,看你写的心里有...

日志存档

  • 2025 年 5 月
  • 2025 年 4 月
  • 2025 年 3 月
  • 2024 年 9 月
  • 2024 年 5 月
  • 2024 年 1 月
  • 2023 年 4 月
  • 2021 年 10 月
  • 2021 年 4 月
  • 2021 年 3 月
  • 2021 年 2 月
  • 2020 年 11 月
  • 2020 年 9 月
  • 2020 年 5 月
  • 2020 年 4 月
  • 2020 年 3 月
  • 2020 年 1 月
  • 2019 年 12 月
  • 2019 年 10 月
  • 2019 年 7 月
  • 2019 年 6 月
  • 2019 年 5 月
  • 2019 年 3 月
  • 2019 年 1 月
  • 2018 年 12 月
  • 2018 年 11 月
  • 2018 年 10 月
  • 2018 年 7 月
  • 2018 年 6 月
  • 2018 年 5 月
  • 2018 年 4 月
  • 2018 年 3 月
  • 2018 年 1 月
  • 2017 年 10 月
  • 2017 年 9 月
  • 2017 年 8 月
  • 2017 年 7 月
  • 2017 年 2 月
  • 2017 年 1 月
  • 2016 年 12 月
  • 2016 年 11 月
  • 2016 年 10 月
  • 2016 年 7 月
  • 2016 年 6 月
  • 2016 年 4 月
  • 2016 年 2 月
  • 2016 年 1 月
  • 2015 年 12 月
  • 2015 年 10 月
  • 2015 年 9 月
  • 2015 年 7 月
  • 2015 年 5 月
  • 2015 年 4 月
  • 2015 年 3 月
  • 2015 年 2 月
  • 2015 年 1 月
  • 2014 年 12 月
  • 2014 年 10 月
  • 2014 年 9 月
  • 2014 年 8 月
  • 2014 年 7 月
  • 2014 年 6 月
  • 2014 年 5 月
  • 2014 年 4 月
  • 2014 年 3 月
  • 2014 年 2 月
  • 2014 年 1 月
  • 2013 年 12 月
  • 2013 年 11 月
  • 2013 年 10 月
  • 2013 年 9 月
  • 2013 年 8 月
  • 2013 年 7 月
  • 2013 年 6 月
  • 2013 年 5 月
  • 2013 年 4 月
  • 2013 年 3 月
  • 2013 年 2 月
  • 2013 年 1 月
  • 2012 年 12 月
  • 2012 年 11 月
  • 2012 年 9 月
  • 2012 年 8 月
  • 2012 年 7 月
  • 2012 年 6 月
  • 2012 年 5 月
  • 2012 年 4 月
  • 2012 年 3 月
  • 2012 年 2 月
  • 2012 年 1 月
  • 2011 年 12 月
  • 2011 年 11 月
  • 2011 年 10 月
  • 2011 年 9 月
  • 2011 年 8 月
  • 2011 年 7 月
  • 2011 年 6 月
  • 2011 年 5 月
  • 2011 年 4 月
  • 2011 年 3 月
  • 2011 年 2 月
  • 2011 年 1 月
  • 2010 年 12 月
  • 2010 年 11 月
  • 2010 年 10 月
  • 2010 年 9 月
  • 2010 年 8 月
  • 2010 年 7 月

W3C

  • XHTML 1.0 Transitional
  • CSS level 3
  • Google+
Copyright © 2010-2025 老谢博客 All rights reserved.
Gzipped 76.5% | Optimized loading 51 queries in 1.036 seconds | Memory 38.86 MB | 尼玛的备案
Powered by WordPress. | Hosted By LAOXUEHOST | Theme by WordPress主题巴士 | 站点地图 | SiteMap | uptime查询