
Vous cherchez un moyen d’ajouter une pagination en utilisant Bootstrap ? Ce snippet crée un menu de navigation numéroté en utilisant les classes CSS natives de Bootstrap.
Instructions:
- Il vous suffit d’ajouter ce code au fichier functions.php de votre thème ou dans un plugin spécifique à votre site.
- Ensuite, appelez la fonction
page_navi()
dans un fichier de modèle pour afficher la pagination avec ce modèle.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 | // Numeric Page Navi function page_navi( $before = '' , $after = '' ) { global $wpdb , $wp_query ; $request = $wp_query ->request; $posts_per_page = intval (get_query_var( 'posts_per_page' )); $paged = intval (get_query_var( 'paged' )); $numposts = $wp_query ->found_posts; $max_page = $wp_query ->max_num_pages; if ( $numposts <= $posts_per_page ) { return ; } if ( empty ( $paged ) || $paged == 0) { $paged = 1; } $pages_to_show = 7; $pages_to_show_minus_1 = $pages_to_show -1; $half_page_start = floor ( $pages_to_show_minus_1 /2); $half_page_end = ceil ( $pages_to_show_minus_1 /2); $start_page = $paged - $half_page_start ; if ( $start_page <= 0) { $start_page = 1; } $end_page = $paged + $half_page_end ; if (( $end_page - $start_page ) != $pages_to_show_minus_1 ) { $end_page = $start_page + $pages_to_show_minus_1 ; } if ( $end_page > $max_page ) { $start_page = $max_page - $pages_to_show_minus_1 ; $end_page = $max_page ; } if ( $start_page <= 0) { $start_page = 1; } echo $before . '<div class="pagination"><ul class="clearfix">' . "" ; if ( $paged > 1) { $first_page_text = "«" ; echo '<li class="prev"><a href="' .get_pagenum_link(). '" title="First">' . $first_page_text . '</a></li>' ; } $prevposts = get_previous_posts_link( '← Previous' ); if ( $prevposts ) { echo '<li>' . $prevposts . '</li>' ; } else { echo '<li class="disabled"><a href="#">← Previous</a></li>' ; } for ( $i = $start_page ; $i <= $end_page ; $i ++) { if ( $i == $paged ) { echo '<li class="active"><a href="#">' . $i . '</a></li>' ; } else { echo '<li><a href="' .get_pagenum_link( $i ). '">' . $i . '</a></li>' ; } } echo '<li class="">' ; next_posts_link( 'Next →' ); echo '</li>' ; if ( $end_page < $max_page ) { $last_page_text = "»" ; echo '<li class="next"><a href="' .get_pagenum_link( $max_page ). '" title="Last">' . $last_page_text . '</a></li>' ; } echo '</ul></div>' . $after . "" ; } |
Note : Si c’est la première fois que vous ajoutez des extraits de code dans WordPress, veuillez consulter notre guide sur la manière de copier/coller correctement des extraits de code dans WordPress, afin de ne pas endommager accidentellement votre site.
Si vous avez aimé cet extrait de code, n’hésitez pas à consulter nos autres articles sur le site comme : 9 meilleurs outils de référencement pour augmenter le trafic de votre site Web, RAPIDEMENT !
doesn’t work in WordPress : Version 5.5.1