Vous cherchez un moyen de créer une pagination manuelle sans plugin ? Bien qu’il existe probablement un plugin pour cela, nous avons créé un extrait de code rapide que vous pouvez utiliser pour créer une navigation par pagination classique et contrôler la sortie de votre contenu dans WordPress.
Instructions:
Tout ce que vous avez à faire est d’ajouter ce code au fichier functions.php de votre thème ou dans un plugin spécifique à votre site:
function pagination($prev = '«', $next = '»') { global $wp_query, $wp_rewrite; $wp_query->query_vars['paged'] > 1 ? $current = $wp_query->query_vars['paged'] : $current = 1; $pagination = array( 'base' => @add_query_arg('paged','%#%'), 'format' => '', 'total' => $wp_query->max_num_pages, 'current' => $current, 'prev_text' => __($prev), 'next_text' => __($next), 'type' => 'plain' ); if( $wp_rewrite->using_permalinks() ) $pagination['base'] = user_trailingslashit( trailingslashit( remove_query_arg( 's', get_pagenum_link( 1 ) ) ) . 'page/%#%/', 'paged' ); if( !empty($wp_query->query_vars['s']) ) $pagination['add_args'] = array( 's' => get_query_var( 's' ) ); echo paginate_links( $pagination ); };
En option, utilisez ce code pour le tableau $pagination
afin d’afficher une apparence différente :
$pagination = array( 'base' => @add_query_arg('paged','%#%'), 'format' => '', 'total' => $wp_query->max_num_pages, 'current' => $current, 'prev_text' => __('« Previous'), 'next_text' => __('Next »'), 'end_size' => 1, 'mid_size' => 2, 'show_all' => true, 'type' => 'list' );
Ensuite, vous pouvez ajouter la pagination en utilisant la fonction pagination()
. Vous pouvez l’ajouter quelque part en dehors de la boucle, mais à l’intérieur de la déclaration if( have_post() )
de votre fichier template.
<?php if ( have_posts() ) : ?> <?php while ( have_posts() ) : the_post(); ?> // post goes here <?php endwhile; ?> <div class="pagination"><?php pagination('»', '«'); ?></div> <?php endif; ?>
WordPress vous permet également d’ajouter des classes CSS personnalisées que vous pouvez utiliser pour gérer l’apparence de votre nouvelle navigation. Consultez cet exemple CSS pour savoir comment la styliser :
.page-numbers { font-size: 15px; } .page-numbers.current { color: #222; } .page-numbers .dots { letter-spacing: 1px } a.page-numbers { font-size: 14px; color: #3888ff; }
Note : Si c’est la première fois que vous ajoutez des extraits de code dans WordPress, veuillez consulter notre guide sur la façon d’ajouter 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 : 43 meilleurs thèmes de photographie pour WordPress et comment passer facilement de Squarespace à WordPress.
Commentaires laisser une réponse