第一步
引入jquery-ias.min.js ,点击下载
第二步
function.php 添加
//获取总分类下文章总数
function ludou_get_cat_postcount($id) {
// 获取当前分类信息
$cat = get_category($id);
// 当前分类文章数
$count = (int) $cat->count;
// 获取当前分类所有子孙分类
$tax_terms = get_terms('category', array('child_of' => $id));
foreach ($tax_terms as $tax_term) {
// 子孙分类文章数累加
$count +=$tax_term->count;
}
return $count;
}
//设置分页
function par_pagenavi($range = 5){
if ( is_singular() ) return; // 文章与插页不用
global $wp_query, $paged;
$max_page = $wp_query->max_num_pages;
if ( $max_page == 1 ) return; // 只有一页不用
if ( empty( $paged ) ) $paged = 1;
//echo ‘<span class=”pages”>页数:’ . $paged . ‘ / ‘ . $max_page . ‘</span>’; // 显示页数
global $paged, $wp_query;
if ( !$max_page ) {$max_page = $wp_query->max_num_pages;}
if($max_page > 1){
if(!$paged){$paged = 1;}
next_posts_link('More');
}
}
第三步
<?php $wp_query = new WP_Query(array('cat'=>1,'showposts'=>20,'paged'=>$paged)); ?>
<div class="waterfall_box clearfix">
<?php if($wp_query->have_posts()) : while($wp_query->have_posts()) : $wp_query->the_post(); ?>
<div class="waterfall_item">
</div>
<?php endwhile; ?>
<?php else : ?>
<?php endif; ?>
</div>
<div class="gdta t3"><span class="nav-previous"><?php par_pagenavi(100000); ?></span></div>
<?php wp_reset_query();?>
<script type="text/javascript">
var page_num = Math.round(<?php echo ludou_get_cat_postcount(1);?> / 20);
var ias = $.ias({
container: ".waterfall_box", //包含所有文章的元素
item: ".waterfall_item", //文章元素
pagination: ".gdta", //分页元素
next: ".nav-previous a", //下一页元素
});
ias.extension(new IASTriggerExtension({
text: 'More+', //此选项为需要点击时的文字
offset: page_num+1, //设置此项后,到 offset+1 页之后需要手动点击才能加载,取消此项则一直为无限加载
}));
ias.extension(new IASSpinnerExtension());
ias.extension(new IASNoneLeftExtension({
text: 'There is no more.', // 加载完成时的提示
}));
ias.on('loaded',function(items){
})
ias.on('rendered', function(items) {
})
</script>