簡體   English   中英

WordPress-無限滾動自定義分頁

[英]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).'">&larr;</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).'">&rarr;</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.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM