Stai cercando un modo per creare una paginazione manuale senza plugin? Sebbene probabilmente esista un plugin per questo, abbiamo creato un rapido snippet di codice che puoi utilizzare per creare una navigazione di paginazione classica e controllare l'output dei tuoi contenuti in WordPress.
Istruzioni:
Tutto quello che devi fare è aggiungere questo codice al file functions.php del tuo tema o in un plugin specifico per il sito:
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 );
};
Facoltativamente, usa questo codice per l'array $pagination per visualizzare un aspetto diverso:
$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'
);
Successivamente puoi aggiungere la paginazione usando la funzione pagination(). Puoi aggiungerla da qualche parte al di fuori del loop, ma all'interno dell'istruzione if( have_post() ) del tuo file di 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 ti consente anche di aggiungere classi CSS personalizzate che puoi utilizzare per gestire l'aspetto della tua nuova navigazione. Vedi questo esempio CSS per capire come stilizzarla:
.page-numbers { font-size: 15px; }
.page-numbers.current { color: #222; }
.page-numbers .dots { letter-spacing: 1px }
a.page-numbers { font-size: 14px; color: #3888ff; }
Nota: Se questa è la prima volta che aggiungi snippet di codice in WordPress, consulta la nostra guida su come aggiungere correttamente snippet di codice in WordPress, in modo da non compromettere accidentalmente il tuo sito.
Se ti è piaciuto questo snippet di codice, prendi in considerazione la lettura dei nostri altri articoli sul sito come: 43 migliori temi di fotografia per WordPress e come passare facilmente da Squarespace a WordPress.
Commenti Lascia una risposta