<div class="container"> <h3>最新评论者 <span class="gray">/ Latest Comment Author</span></h3> <div id="read-wall"> <?php // 免插件版侧边栏读者墙 global $wpdb; // 执行数据库查询 $counts = $wpdb->get_results("SELECT COUNT(comment_author) AS cnt, comment_author, comment_author_url, comment_author_email FROM {$wpdb->prefix}comments WHERE comment_date > date_sub( NOW(), INTERVAL 24 MONTH ) AND comment_approved = '1' AND comment_author_email != 'i@rengang.com.cn' AND comment_type = '' GROUP BY comment_author_email ORDER BY comment_date DESC LIMIT 32"); $mostactive = ''; if ( $counts ) { // 输出读者列表 foreach ($counts as $count) { $c_url = $count->comment_author_url; $mostactive .= '<li>' . '<a href="'. $c_url . '" rel="nofollow" alt="' . $count->comment_author .'" target="_blank" title="' . $count->comment_author .' +'. $count->cnt . '">' . get_avatar($count->comment_author_email, 55) . '</a></li>'; } echo $mostactive; } ?> </div> </div>

样式加以美化:

/* 读者墙 */
#read-wall {
	margin: 10px auto;
	padding: 0 20px 0 20px;
	;
	text-align: center;
}
#read-wall li {
	display: inline-block;
 *display: inline;
	zoom: 1;
	list-style: none;
	padding: 5px;
}
#read-wall li img {
	position: relative;
float: left;
margin-right: 10px;
padding: 4px;
width: 54px;
height: 54px;
border: 1px solid #eee;
-webkit-border-radius: 36px;
-moz-border-radius: 36px;
border-radius: 36px;
background: #fff;
-webkit-box-shadow: inset 0 -1px 0 #3333sf;
box-shadow: inset 0 -1px 0 #3333sf;
-webkit-transition: .4s;
-webkit-transition: -webkit-transform .4s ease-out;
-moz-transition: -moz-transform .4s ease-out;
transition: transform .4s ease-out;
}
#read-wall .container {
	height: auto;
	background: url(images/pattern.png) repeat;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	padding: 15px;
}

效果大致如下:

Reader Wall – WordPress读者墙代码(头像、用户名、评论者链接) - 任刚 · Ren Gang - 我的设计笔记 世界设计 · 设计世界

" /> 读者墙 · 任刚 · Ren Gang - 我的设计笔记

读者墙    330

登 录 注 册