La pagination dans les articles ou les custom post type

Ici on va voir comment inclure la pagination rapidement sur son site wordpress: les fonctions sont tirées des exemples pris sur le site de Kriesi et d’autres extensions..

voici la fonction à insérer dans functions.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 "



</p>
<nav class='custom-pagination'>";
      echo "<span class='page-numbers page-num'>Page " . $paged . " sur " . $numpages . "</span> ";
      echo $paginate_links;
    echo "</nav>
<p>




";
  }

}

Voici un exemple de css:

/* ============================================================
  PAGINATION ACTUALITES
============================================================ */
.custom-pagination span,
.custom-pagination a {
  display: inline-block;
    padding: 8px 11px;
    text-decoration:none!important;
}
.custom-pagination a {
  background-color: #958a83;
  color: #fff;
  transition: all 0.2s ease-in-out
}
.custom-pagination a:hover {
  background-color: #c9a64f; 
  color: #fff;
}
.custom-pagination span.page-num {
  margin-right: 10px;
  padding: 0;
}
.custom-pagination span.dots {
  padding: 0;
  color: gainsboro;
}
.custom-pagination span.current {
  background-color:  #c9a64f;
  color: #fff;
}

.custom-pagination{  text-align: center;  margin-top: 2em;}
.clear{clear:both}

Ensuite, dans ses fichiers d’archives, on inclut cette pagination dans la boucle:

Voici un exemple:

        <?php $paged = ( get_query_var('paged') ) ? get_query_var('paged') : 1; $custom_args = array( 'post_type' => 'publication',
            'posts_per_page' => 5,
            'post_status' => ' published',
            'order_by' => 'post_date',
            'order' => 'DESC',
            'paged' => $paged
        );

        ;
        ?>                      <?php $custom_query = new WP_Query($custom_args); ?>
        <?php if ($custom_query->have_posts()) : ?>
    <?php while ($custom_query->have_posts()) : $custom_query->the_post(); ?>

Dans la même page, une fois la fonction appelée, il va falloir placer la pagination à l’endroit souhaité.Ici je le place évidemment en dehors de ma boucle.

 <?php endwhile; ?>
     
        <?php wp_reset_postdata(); ?>
<?php endif;?>
        <?php if (function_exists(custom_pagination)) { custom_pagination($custom_query->max_num_pages, "", $paged);
        }
        ?>

En fonction du nombre d’articles (ou custom post) par page indiqué dans la fonction ( ‘posts_per_page’ => 2,), wordpress va automatiquement créer les pages:

Et voici la manières simplifiée.

  $wp_query = new WP_Query(); 
  $wp_query->query('showposts=6&post_type=chroniques'.'&paged='.$paged);

On inclut le paramètre paged dans les arguments de notre requête pour indiquer à wordpress qu’on souhaite enclencher le système de pagination.

Enfin, dernière étape et non des moindres, car si on ne le sait pas on peut simplement y passer la journée..voir ne jamais comprendre pourquoi ca ne marche pas.

En fait, le nombre de post à afficher dans votre requête, doit être égal ou inférieur au nombre de post indiqué dans le backoffice – onglet ‘lecture’

si dans le code on affiche un nombre plus grand que dans le backoffice, wordpress ne va pas comprendre et n’affichera donc pas de pagination.Bien faire attention à ce point!!

La fonction paginate_links()

WordPress ne cesse d’évoluer, et la fonction paginate_links() permet maintenant de créer une pagination très simplement. Voici un exemple d’implémentation,à l’intérieur d’un page archive. Le résultat, vous pouvez l’observer sur ce présent site. Je vous renvoie à cette page pour en savoir plus. Il n’y a pas besoin de créer une fonction spécifique, et dans le cas d’une boucle simple, seule la fonction paginate_links() suffit pour afficher la pagination. Il faudra bien sûr penser à styliser le tout grâce au css. La fonction peut-être appelée telle sans faire appel à la variable globlae $paged, dans les pages où on retrouve la boucle classique de wordpress (index.php, archive.php, category.php, search.php).

<?php
   get_header();
   ?>
<div class="col-sm-12 col-xs-12" id="content">
   <?php if ( have_posts() ) : ?>
   <header class="archive-header">
      <h1 class="archive-title"><?php printf(__('Tutoriels sur: %s', 'personnal'), '<span>' . single_cat_title('', false) . '</span>'); ?></h1>
      <?php if (category_description()) : // Show an optional category description ?>
      <div class="archive-meta"><?php echo category_description(); ?></div>
      <?php endif; ?>
   </header>
   <!-- .archive-header -->
   <div id="grid-container" class="grid">
    <?php  // Start the Loop.
   

     
      // Start the Loop.
      while ( have_posts() ) :
        the_post();

        /*
         * Include the Post-Format-specific template for the content.
         * If you want to override this in a child theme, then include a file
         * called content-___.php (where ___ is the Post Format name) and that will be used instead.
         */
        get_template_part('content', get_post_format());

        // End the loop.
      endwhile;?>

        </div>
      <?php  else : ?>
      <?php get_template_part('content', 'none'); ?>
      <?php endif; ?>
       <?php $big = 999999999; // need an unlikely integer
          echo '<nav class="custom-pagination">';
          global $wp_query;
          $big = 999999999; // need an unlikely integer

          echo paginate_links( array(
            'base' => str_replace( $big, '%#%', esc_url( get_pagenum_link( $big ) ) ),
            'format' => '?paged=%#%',
            'current' => max( 1, get_query_var('paged') ),
            'total' => $wp_query->max_num_pages
          ) );
          echo '</nav>';
         ?> 

</div><!-- #content -->  
<?php get_footer(); ?>

En revanche pour les custom post types ou toute autre boucle customisée, comme pour une catégorie particulière, il faudra inclure la variable dans les paramètres de la requête.

<?php
//Protect against arbitrary paged values
$paged = ( get_query_var( 'paged' ) ) ? absint( get_query_var( 'paged' ) ) : 1;
 
$args = array(
    'posts_per_page' => 5,
    'category_name' => 'gallery',
    'paged' => $paged,
);
 
$the_query = new WP_Query( $args );
?>
<!-- the loop etc.. -->

<?php
$big = 999999999; // need an unlikely integer
 
echo paginate_links( array(
    'base' => str_replace( $big, '%#%', esc_url( get_pagenum_link( $big ) ) ),
    'format' => '?paged=%#%',
    'current' => max( 1, get_query_var('paged') ),
    'total' => $the_query->max_num_pages
) );
?>

24/08/2015 Mis à jour le 20/12/2019 Par Copier coller | Dans wordpress