28 typecho读者墙按来访顺序排序的方法

想跟风地给博客做个读者墙,网上找到的方法大概两种:一种用插件,一种不用插件。找了半天,终于找到一个比较喜欢的样式(《Typecho CSS3个性留言板之读者墙页面的实现方法》),实现方法是一个函数一个样式一个调用。按照教程操作后,发现是按评论数量由多到少排序的,个人不太喜欢这种排序方法,喜欢随机的,或者是按来访时间排序的。

问题解决过程有些曲折,不过,最终还是完美解决了,现分享在这里:
1、改随机比较简单,把第12行里面的“cnt”改成“RAND()”就行了,

//获得读者墙(随机排序)
function getFriendWall() 
{
  $db = Typecho_Db::get(); 
  $sql = $db->select('COUNT(author) AS cnt', 'author', 'url', 'mail') 
            ->from('table.comments') 
            ->where('status = ?', 'approved')
            ->where('type = ?', 'comment') 
            ->where('authorId = ?', '0') 
            ->where('mail != ?', '80060631@qq.com')   //排除自己上墙 
            ->group('author') 
            ->order('RAND()', Typecho_Db::SORT_DESC)   //原代码这里是“cnt”是按评论数量排序
            ->limit('99999');    //读取几位用户的信息     
  $result = $db->fetchAll($sql); 
  if (count($result) > 0) { 
    $maxNum = $result[0]['cnt'];  
    foreach ($result as $value) { 
    $mostactive .= '<li><a target="_blank" href="' . $value['url'] . '"><span class="pic" style="background: url(http://sdn.geekzu.org/avatar/'.md5(strtolower($value['mail'])).'?s=36&d=&r=G) no-repeat; "></span><em>' . $value['author'] . '</em><strong>+' . $value['cnt'] . '</strong><br />' . $value['url'] . '</a></li>'; 
      }
      echo $mostactive; 
  } 
}

修改后的读者墙,是页面刷新一次,随机排序一次,每次都不一样,效果见本站“链接”页面。

2、改成按评论时间由近到远排序,稍微麻烦些,如下,

//获得读者墙(按访问时间排序)getFriendWall函数名后加了个b,以便分别调用
function getFriendWallb() 
{
  $db = Typecho_Db::get();
  $sql = $db->select('COUNT(author) AS cnt','max(coid) ttt', 'author', 'url', 'mail') 
             ->from('table.comments')
             ->where('status = ?', 'approved')
             ->where('type = ?', 'comment')
             ->where('authorId = ?', '0') 
             ->where('mail != ?', '80060631@qq.com')   //排除自己上墙
             ->group('author')
             ->order('ttt', Typecho_Db::SORT_DESC)
             ->limit('12');    //读取几位用户的信息
$result = $db->fetchAll($sql);
if (count($result) > 0) {
  $maxNum = $result[0]['cnt'];
  foreach ($result as $value) {
  $mostactive .= '<li><a target="_blank" href="' . $value['url'] . '"><span class="pic" style="background: url(http://sdn.geekzu.org/avatar/'.md5(strtolower($value['mail'])).'?s=36&d=&r=G) no-repeat; "></span><em>' . $value['author'] . '</em><strong>+' . $value['cnt'] . '</strong><br />' . $value['url'] . '</a></li>'; 
    }
    echo $mostactive;
  }
}

修改后的读者墙,是按留言时间由近到远排序的,效果见本站“冒泡”页面。


最后,把那段调用和css从《Typecho CSS3个性留言板之读者墙页面的实现方法》Copy到这里吧,
调用代码:

<!-- 读者墙php里调用 -->
<div id="list-post">
<ul class='readers-list'>
<?php getFriendWall(); ?>
</ul></div>

css:

/**读者墙css*/
.readers-list {line-height:16px;text-align:left;_zoom:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-o-text-}
.readers-list li{width:180px;float:left;*margin-right:-1px;list-style:none;}
.readers-list a,.readers-list a:hover strong{background-color:#f2f2f2;background-image:-webkit-linear-gradient(#f8f8f8,#f2f2f2);background-image:-moz-linear-gradient(#f8f8f8,#f2f2f2);background-image:linear-gradient(#f8f8f8,#f2f2f2);}
.readers-list a{position:relative;display:block;height:30px;margin:4px;padding:2px 4px 2px 44px;color:#999;overflow:hidden;border:#ccc 1px solid;border-radius:2px;box-shadow:#eee 0 0 2px;font-size:10px;line-height:14px;}
.readers-list .pic,.readers-list em,.readers-list strong{-webkit-transition:all .2s ease-out;-moz-transition:all .2s ease-out;transition:all .2s ease-out;}
.readers-list .pic{width:30px;height:30px;float:left;margin:0 8px 0 -40px;border-radius:2px;}
.readers-list em{color:#666;font-style:normal;margin-right:10px;font:bold 12px/16px microsoft yahei;}
.readers-list strong{color:#ddd;width:34px;text-align:right;position:absolute;right:6px;top:4px;font:bold 14px/16px microsoft yahei;}
.readers-list a:hover{border-color:#bbb;box-shadow:#ccc 0 0 2px;background-color:#fff;background-image:none;}
.readers-list a:hover .pic{opacity:.6;margin-left:0;}
.readers-list a:hover em{color:#EE8B17;font:bold 12px/36px microsoft yahei;}
.readers-list a:hover strong{color:#EE8B17;right:134px;top:0;text-align:center;border-right:#ccc 1px solid;height:34px;line-height:34px;}

好了,学而实记之,不易忘乎。📝记在这里,方便以后查找。

相关文章

已有 18 条评论
  1. 小熊
     沙发

    博客的乐趣折腾,晚安王老师,少熬夜呀

    小熊 回复
    1. wys

      @小熊

      🛌(~﹃~)~zZ

      wys 回复
  2. 小彦
     板凳

    熟悉的php代码,好久没搞php了

    小彦 回复
    1. wys

      @小彦

      应该好玩。准备业余一下。

      wys 回复
  3. 老麦
     地毯

    折腾起来永无止境😏

    老麦 回复
    1. wys

      @老麦

      好像是这么回事,自从接触博客后,一直粘在电脑上了。

      wys 回复
  4. Mr.Chou
      4 楼

    非常有用,我用的也是这代码~我是不懂修改你这竟然分享了必须收藏起来或许以后用得上,谢谢。

    Mr.Chou 回复
    1. wys

      @Mr.Chou

      (•‾̑⌣‾̑•)✧˖°喜欢就好,是出于让日志有点价值吧。

      wys 回复
  5. 一宁宝贝
      5 楼

    我的是主题自带读者墙,但收藏了,因为也想改成随机显示的

    一宁宝贝 回复
    1. wys

      @一宁宝贝

      😀每种排序都有它的利弊吧,谢谢收藏。我越来越感觉,读者墙有友情链接的味道了。

      wys 回复
  6. 空空裤兜
      6 楼

    才发现我的主题有读者墙。

    空空裤兜 回复
    1. wys

      @空空裤兜

      曾经的不经意,如今的大惊喜。

      wys 回复
  7. 不亦乐乎
      7 楼

    原来是按留言时间排序,我还以为是按打开页面的来访时间呢。

    不亦乐乎 回复
    1. wys

      @不亦乐乎

      效果差不多吧,留言了才有数据可抓啊。︿( ̄︶ ̄)︿

      wys 回复
  8. 姜辰Jcs.Moe
      8 楼

    强!最初的emlog,到wp,再到如今的typecho,王老师还是能折腾。

    姜辰Jcs.Moe 回复
    1. wys

      @姜辰Jcs.Moe

      姜老师见笑了。只是想有个新的开始,just so so.(⌐■_■)

      wys 回复
  9. XIGE
      9 楼

    max(coid) ttt,这代码里的ttt是你新增的字段或函数吗?我看了下数据表里无这个字段

    XIGE 回复
    1. wys

      @XIGE

      max(coid) ttt 是某个大佬帮我修改的,记得当时没有增加字段和函数,说ttt是typecho给coid自带的。因为typecho_comments里面只有个created,这个不管用。下班了我回家查下文件。

      wys 回复
发表新评论