效果图如下：

我相信你对这篇文章的第一张图片很熟悉。你可能在其他博客的读者墙或留言板页面上看到过。这是非常简单和真实的记录访客的博客和足迹留下的方便回访。这也是博客互动的重要基础或方式。接下来，我们来谈谈如何在Typecho下实现这样一个个性化的访问记录：

第一：把下面代码粘贴到当前主题的functions.php页面

PHP Code复制内容到剪贴板
  1. //获得读者墙
  2. function getFriendWall()
  3. {
  4.     $db = Typecho_Db::get();
  5.     $sql = $db->select(‘COUNT(author) AS cnt’, ‘author’, ‘url’, ‘mail’)
  6.               ->from(‘table.comments’)
  7.               ->where(‘status = ?’, ‘approved’)
  8.               ->where(‘type = ?’, ‘comment’)
  9.               ->where(‘authorId = ?’, ‘0’)
  10.               ->where(‘mail != ?’, ‘admin@ben-lab.com’)   //排除自己上墙
  11.               ->group(‘author’)
  12.               ->order(‘cnt’, Typecho_Db::SORT_DESC)
  13.               ->limit(’15’);    //读取几位用户的信息  
  14.     $result = $db->fetchAll($sql);
  16.     if (count($result) > 0) {
  17.         $maxNum = $result[0][‘cnt’];
  18.         foreach ($result as $value) {
  19.             $mostactive .= ‘<li><a target=”_blank” rel=”nofollow” href=”‘ . $value[‘url’] . ‘”><span class=”pic” style=”background: url(http://1.gravatar.com/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>’;
  20.         }
  21.         echo $mostactive;
  22.     }
  23. }

第二：在主題目录里新建一个guestbook.php,粘贴以下代码,当然,新建页面的名称可以自己填写,本篇是以guestbook为例,你懂的

代码如下:

<?php
/**
* 自定义页面模板
*
* @package custom
*/
?>

第三、打开当前主题的page.php,复制全部代码.粘贴到guestbook.php,然后放入第二步的代码

第四、替换代码,搜索下面代码内容

代码如下:

<?php $this->content(”); ?>

替换成代码如下:

<div id=”list-post”>
<ul class=’readers-list’>
<?php getFriendWall(); ?>
</ul></div>

第五、打开主题的style.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;}

第六、新建页面或者编辑你的读者墙页面,点击底部高级选项,在自定义模版选择”自定义页面模版”发布即可!

1.本站所有资源来源于用户上传和网络，如有侵权请邮件联系站长!
2.分享目的仅供大家学习和交流，您必须在下载后24小时内删除!
3.不得使用于非法商业用途，不得违反国家法律。否则后果自负!
4.本站提供的源码、模板、插件等其他资源，都不包含技术服务请大家谅解!
5.如有链接无法下载或失效，请联系管理员处理!
6.本站资源售价只是赞助，收取费用仅维持本站的日常运营所需!