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 de pagination classique et contrôler la sortie de votre contenu dans WordPress.
Instructions :
Il vous suffit d'ajouter ce code au fichier functions.php de votre thème ou dans un plugin spécifique au 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 );
};
Facultativement, utilisez ce code pour le tableau $pagination afin d'afficher un aspect différent :
$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 l'instruction if( have_post() ) de votre fichier de modèle.
<?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. Voir cet exemple CSS pour comprendre comment le 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; }
Remarque : Si c'est la première fois que vous ajoutez des extraits de code dans WordPress, veuillez consulter notre guide sur la manière 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 tels que : 43 meilleurs thèmes de photographie pour WordPress et comment passer facilement de Squarespace à WordPress.
Commentaires Laisser une réponse