[英]Wordpress - Custom pagination with infinite scroll
我有一個網站,在我的頁面新聞中,我添加了一個帶有無限滾動的自定義分頁,如果永久鏈接是day and name
那么該分頁效果很好day and name
但是現在我必須簡單地說明這一點。
當我將永久鏈接設置為泛型時,無限滾動不會停止並重復發布。
在我的function.php
我有以下代碼:
function custom_pagination($numpages = '', $pagerange = '', $paged='') {
if (empty($pagerange)) {
$pagerange = 2;
}
global $paged;
if (empty($paged)) {
$paged = 1;
}
if ($numpages == '') {
global $wp_query;
$numpages = $wp_query->max_num_pages;
if(!$numpages) {
$numpages = 1;
}
}
$pagination_args = array(
'base' => get_pagenum_link(1) . '%_%',
'format' => 'page/%#%',
'total' => $numpages,
'current' => $paged,
'show_all' => False,
'end_size' => 1,
'mid_size' => $pagerange,
'prev_next' => True,
'prev_text' => __('«'),
'next_text' => __('»'),
'type' => 'plain',
'add_args' => false,
'add_fragment' => ''
);
$paginate_links = paginate_links($pagination_args);
if ($paginate_links) {
echo "<nav id='pagination' class='custom-pagination'>";
echo "<span class='page-numbers page-num'>Page " . $paged . " of " . $numpages . "</span> ";
echo $paginate_links;
echo "</nav>";
}
}
在我的模型新聞中,我有以下內容:
<div class="infinite-scroll">
<?php
$category = get_field('nome', get_the_ID());
$paged = ( get_query_var('paged') ) ? get_query_var('paged') : 1;
var_dump($paged);
$custom_args = array(
'post_type' => 'post',
'posts_per_page' => 6,
'paged' => $paged,
'category_name' => $category,
);
$articles = new WP_Query( $custom_args );
?>
<?php if ( $articles->have_posts() ) : while ( $articles->have_posts() ) : $articles->the_post(); // run the loop ?>
<div class="col-xs-12 col-sm-6 col-md-4">
<a class="news-link" href="<?php the_permalink() ?>">
<div class="news">
<div class="image">
<?php the_post_thumbnail('thumbnail') ?>
</div>
<div class="title">
<span>
<?php the_title(); ?>
</span>
</div>
<div class="excerpt">
</div>
</div>
</a>
</div>
<?php endwhile; ?>
<?php
var_dump($articles->max_num_pages);
if (function_exists(custom_pagination)) {
custom_pagination($articles->max_num_pages,"",$paged);
}
?>
</div>
在js文件中,我可以無限滾動:
$('.infinite-scroll').jscroll({
autoTrigger: true,
loadingHtml: '<img class="center-block" src="/wp-content/themes/template/images/loader.gif" alt="Loading..." />',
padding: 0,
nextSelector: '#pagination .next',
contentSelector: 'div.infinite-scroll',
callback: function() {
$('#pagination').remove();
}
});
我認為問題在於分頁鏈接不會停止。
我怎么解決這個問題?
您可以在function.php文件中遵循以下功能
您的functions.php文件的代碼:
function pagination($pages = '', $range = 2) { $morepages = ($range * 2)+1; global $paged; if(empty($paged)) $paged = 1; if($pages == '') { global $wp_query; $pages = $wp_query->max_num_pages; if(!$pages) { $pages = 1; } } if(1 != $pages) { echo '<div class="pagination">'; if($paged > 1 && $morepages < $pages) echo '<a class="prev-link" href="'.get_pagenum_link($paged - 1).'">←</a>'; if($paged > 2 && $paged > $range+1 && $morepages < $pages) echo '<a href="'.get_pagenum_link(1).'">1</a><span class="separate">...</span>'; for ($i=1; $i <= $pages; $i++) { if (1 != $pages &&( !($i >= $paged+$range+1 || $i <= $paged-$range-1) || $pages <= $morepages )) { echo ($paged == $i)? '<span class="current">'.$i.'</span>':'<a href="'.get_pagenum_link($i).'">'.$i.'</a>'; } } if ($paged < $pages-1 && $paged+$range-1 < $pages && $morepages < $pages) echo '<span class="separate">...</span><a class="last-link" href="'.get_pagenum_link($pages).'">'.$pages.'</a>'; if ($paged < $pages && $morepages < $pages) echo '<a class="next-link" href="'.get_pagenum_link($paged + 1).'">→</a>'; echo '</div>'; } }
然后將其放入適當的主題中(通常在index.php,archive.php,category.php,search.php文件上):
這是默認的實現,它將在當前頁面周圍顯示指向兩個頁面的鏈接,以及首頁和末頁鏈接以及上一頁/下一頁鏈接。
但是您也可以在調用函數時定義其中一些屬性:
<?php pagination('','3'); ?>
這將在當前頁面周圍顯示三個鏈接。
<?php pagination('5'); ?>
這將僅顯示從第1頁到第5頁的5個鏈接。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.