读者墙代码

在你想调用的地方加上下面的代码

<div id=”wallloading”>读者墙奋力加载中</div>

JS代码就不要放到JS文件中了,直接放在读者墙页面中

<script>jQuery(document).ready(function($) {
if ($(“#readerwall”).length) {
var home_url=”<?php echo esc_url(home_url(‘/’)); ?>”;
$.get(home_url + “?action=ajax_readerwall”, function(data) {
$(“#readerwall”).html(data);
});
return false;
}
});</script>

php后端响应部分,参考了大叔的代码

function ajax_readerwall(){
if( isset($_GET[‘action’])&& $_GET[‘action’] == ‘ajax_readerwall’ ){
nocache_headers();
?>
<?php if(function_exists(‘mostactive_bigfa’)) mostactive_bigfa(); ?>
<?php
die();
}
}
add_action(‘init’, ‘ajax_readerwall’);
function mostactive_bigfa() {
if(!$mostactive = get_option(‘mostactive’)){
global $wpdb;
$limit_num = ’30’;
$time = ‘1 MONTH’;
$noneurl = “‘” . get_bloginfo (‘url’) . “‘”;
$my_email = “‘” . get_bloginfo (‘admin_email’) . “‘”;
$counts = $wpdb->get_results(”
SELECT COUNT(comment_author) 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 $time )
AND comment_author_email != $my_email
AND post_password=”
AND comment_approved=’1’
AND comment_type=”) AS tempcmt GROUP BY comment_author_email
ORDER BY cnt DESC LIMIT $limit_num
“);
$mostactive = ”;
if(empty($counts)) {
$mostactive = ‘<li>none data.</li>’;
} else {
foreach ($counts as $count) {
$c_url = $count->comment_author_url;
if ($c_url == ”) $c_url = $noneurl;
$title_alt = $count->comment_author . ‘ (‘. $count->cnt. ‘ comments)’;
$mostactive .= ‘<li>’ . ‘<a rel=”external nofollow” href=”‘. $c_url . ‘” title=”‘ .$title_alt
. ‘”>’.get_avatar($count->comment_author_email,$size=’48’,$default=”).'</a></li>’;
}
}
update_option(‘mostactive’, $mostactive);
}
echo ‘<ul>’.$mostactive.'</ul>’;
}
function clear_mostactive() {
update_option(‘mostactive’, ”);
}
add_action(‘comment_post’, ‘clear_mostactive’);
add_action(‘edit_comment’, ‘clear_mostactive’);

【css样式供参考】

#readerwall{background:#F8F8F8;border-bottom: 3px double #DDDDDD;border-top: 3px double #DDDDDD;margin: 0 0 20px;}
.wall{overflow:hidden;padding: 10px;}
.wall li{float:left;margin:5px}
.wall li img{border-radius: 30px;box-shadow: 0 0 3px rgba(0, 0, 0, 0.4);}
.wall li img:hover{transform:scale(1.1)}
#noticeloading,#wallloading{padding:20px;text-align:center}