5 frammenti di codice di impaginazione di WordPress con esempi [da semplice ad avanzato]
Pubblicato: 2020-02-03Se stai cercando il miglior codice di impaginazione in WordPress con esempi specifici, troverai molto utili gli esempi di frammenti di codice di impaginazione condivisi in questo post. Puoi applicare questo codice di impaginazione nel tema WordPress o in un plug-in WordPress personalizzato che richiede l'impaginazione dei post. Consentitemi di tagliare l'inseguimento e condividere i miei frammenti di codice di impaginazione preferiti:
#1) Ciclo di WordPress con codice di impaginazione semplice
Se desideri aggiungere l'impaginazione all'interno del ciclo di WordPress, puoi utilizzare il codice di impaginazione successivo e precedente di seguito:
<?php if ( have_posts() ) : ?> <!-- Aggiungi qui le funzioni di impaginazione. --> <!-- Inizio del ciclo principale. --> <?php while ( have_posts() ) : the_post(); ?> <!-- il resto del ciclo principale del tuo tema --> <?php nel frattempo; ?> <!-- Fine del ciclo principale --> <!-- Aggiungi qui le funzioni di impaginazione. --> <div class="nav-previous alignleft"><?php previous_posts_link( 'Post più vecchi' ); ?></div> <div class="nav-next alignright"><?php next_posts_link( 'Post più recenti' ); ?></div> <?php altro: ?> <p><?php _e('Spiacente, nessun post corrisponde ai tuoi criteri.'); ?></p> <?php endif; ?>
#2) Impaginazione numerica di WordPress
Un'altra ottima opzione di impaginazione di WordPress è utilizzare l'impaginazione numerica che aggiunge numeri ai post e raggruppa i post in base a un numero. Ad esempio, puoi visualizzare 5 post su una pagina. Questo è il codice di impaginazione in WordPress per l'impaginazione numerica :
<?php #PASSAGGIO 1: Crea la funzione di impaginazione numerica di WordPress funzione njengah_numeric_pagination() { if( è_singolare() ) Restituzione; $wp_query globale; /** Interrompi l'esecuzione se c'è solo 1 pagina */ if( $wp_query->max_num_pagine <= 1 ) Restituzione; $paged = get_query_var( 'paged' ) ? absint( get_query_var( 'paged' ) ) : 1; $max = intval($wp_query->max_num_pagine); /** Aggiungi la pagina corrente all'array */ se ( $paginato >= 1 ) $link[] = $impaginato; /** Aggiungi le pagine intorno alla pagina corrente all'array */ se ( $paginato >= 3 ) { $link[] = $impaginato - 1; $link[] = $impaginato - 2; } if ( ( $impaginato + 2 ) <= $max ) { $link[] = $impaginato + 2; $link[] = $impaginato + 1; } echo '<div class="navigazione"><ul>' . "\n"; /** Link al post precedente */ se ( get_previous_posts_link() ) printf( '<li>%s</li>' . "\n", get_previous_posts_link() ); /** Link alla prima pagina, più puntini di sospensione se necessario */ if ( ! in_array( 1, $ link ) ) { $classe = 1 == $impaginato ? ' class="attivo"' : ''; printf( '<li%s><a href="%s">%s</a></li>' . "\n", $class, esc_url( get_pagenum_link( 1 ) ), '1' ); if ( ! in_array( 2, $links ) ) echo '<li>...</li>'; } /** Collegamento alla pagina corrente, più 2 pagine in entrambe le direzioni, se necessario */ ordina($link); foreach ( (array) $link come $link ) { $classe = $paged == $link ? ' class="attivo"' : ''; printf( '<li%s><a href="%s">%s</a></li>' . "\n", $class, esc_url( get_pagenum_link( $link ) ), $link); } /** Link all'ultima pagina, più puntini di sospensione se necessario */ if ( ! in_array( $ max, $ link ) ) { if ( ! in_array( $ max - 1, $ link ) ) echo '<li>...</li>' . "\n"; $classe = $paged == $max ? ' class="attivo"' : ''; printf( '<li%s><a href="%s">%s</a></li>' . "\n", $class, esc_url( get_pagenum_link( $max ) ), $max); } /** Collegamento post successivo */ se ( get_next_posts_link() ) printf( '<li>%s</li>' . "\n", get_next_posts_link() ); echo '</ul></div>' . "\n"; } #PASSAGGIO 2: aggiungi ai modelli utilizzando questa chiamata alla funzione sopra njengah_numeric_pagination(); #PASSAGGIO 3: modella l'impaginazione in modo appropriato per adattarla agli stili del tuo tema /** Classi CSS per lo stile dell'impaginazione*/ .navigazione li { } .navigazione li a{ }
#3) Esempio di impaginazione Ajax di WordPress
Se stai cercando il codice di impaginazione Ajax in WordPress, ho trovato un esempio su GitHub che funziona molto bene e il codice è sotto forma di plug-in. L'ho personalizzato per renderlo un plug-in per il nostro tutorial e il codice può essere copiato su un file e salvato in formato zip e installato come plug-in. Quello che segue è il codice di esempio di impaginazione Ajax di WordPress:
<?php /** * Nome plug-in: paginazione Njengah Ajax * URI del plug-in: https://njengah.com * Descrizione: esempio di impaginazione Ajax di WordPress. * Versione: 1.0.0 * Autore: Joe Njenga * URI dell'autore: https://njengah.com * Licenza: GPL-2.0+ * URI della licenza: http://www.gnu.org/licenses/gpl-2.0.txt * Dominio di testo: cs-impaginazione * Percorso del dominio: /lingue */ // Credito - Casper Schultz class Njengah_Ajax_Pagination { protetto $num_per_pagina; funzione pubblica __costruzione() { $questo->num_per_pagina = 5; $this->init(); } funzione protetta init() { add_action('init', array($this, 'add_rewrite_rule')); add_filter('query_vars', array($this, 'add_query_vars')); add_action('analisi_richiesta', array($questo, 'analisi_richiesta')); } /** * Analizza la richiesta in arrivo e genera il risultato. */ funzione parse_request($wp) { if ( array_key_exists( 'cs-page', $wp->query_vars ) ) { $pagina = isset ($wp->query_vars['cs-page'] )? $wp->query_vars['cs-page'] : 1; $args = array( 'post_type' => 'post', 'post_per_page' => $this->num_per_page, 'paged' => $pagina, ); $ query = nuova WP_Query($args); // Dobbiamo conoscere il numero totale di post trovati. $valori['totale'] = $query->post_trovati; // E per pagina. $values['per_page'] = $this->num_per_page; $valori['post'] = array(); // Inviamo solo i dati di cui abbiamo bisogno. mentre ( $query->have_posts() ) { $query->il_post(); $valori['post'][] = array( 'ID' => get_the_ID(), 'titolo' => get_the_title(), ); } wp_reset_postdata(); wp_send_json($valori); } } /** * Aggiungi gli argomenti di query necessari. */ funzione add_query_vars($query_vars) { $query_vars[] = 'cs-page'; restituisce $var_query; } /** * Aggiunge una regola di riscrittura per la nostra impaginazione personalizzata in modo da poter evitare l'utilizzo di admin-ajax. */ funzione aggiungi_riscrivi_regola() { add_rewrite_rule( '^cs-paginate/([0-9]+)/?', 'index.php?cs-page=$matches[1]', 'top'); } /** * Regole di riscrittura a filo. */ funzione statica install() { flush_rewrite_rules(); } } funzione njengah_ajax_pagination_init() { new Njengah_Ajax_Pagination(); } njengah_ajax_pagination_init(); // Necessità di svuotare le regole di riscrittura all'attivazione. register_activation_hook( __FILE__, array( 'Njengah_Ajax_Pagination', 'installa' ) );
#4) Impaginazione WordPress per tipo di post personalizzato
Per l'impaginazione del tipo di post personalizzato, è necessario utilizzare WP_query per verificare il tipo di post personalizzato e negli argomenti, passare il tipo di post personalizzato in post_type e quindi utilizzare il codice di impaginazione per creare l'impaginazione di WordPress per il tipo di post personalizzato.
Quello che segue è il codice che dovresti aggiungere a functions.php e sostituire post_type con il tuo rispettivo tipo di post personalizzato slug:
<?php /** * Impaginazione WordPress per tipi di post personalizzati */ <?php $paged = ( get_query_var( 'paged' ) ) ? get_query_var( 'impaginato' ) : 1; $args = array( 'tipo_post' => 'nome_tipo_post_personalizzato', 'post_per_page' => 10, 'paged' => $paged ); $loop = nuovo WP_Query($args); while ($loop->have_posts() ): $loop->the_post(); // Contenuto del tipo di post personalizzato nel frattempo; ?> <nav class="impaginazione"> <?php $ grande = 999999999; echo paginate_links( array( 'base' => str_replace($grande, '%#%', get_pagenum_link($grande)), 'formato' => '?paged=%#%', 'current' => max( 1, get_query_var('paged') ), 'totale' => $loop->max_num_pages, 'prev_text' => '«', 'next_text' => '»' ) ); ?> </nav> <?php wp_reset_postdata(); ?>
#5 Impaginazione di query personalizzate WordPress
Il codice di impaginazione della query personalizzata in WordPress utilizza WP_query per ottenere il post specifico che desideriamo impaginare e quindi combina i risultati della query con il codice di impaginazione per applicare l'impaginazione ai post specifici che abbiamo selezionato. Quello che segue è un esempio di impaginazione di query personalizzate in WordPress.
<?php //Richiesta personalizzata $paged = ( get_query_var( 'paged' ) ) ? absint( get_query_var( 'paged' ) ) : 1; $args = array( 'post_per_pagina' => 5, 'nome_categoria' => 'galleria', 'paged' => $paged, ); $la_query = nuova WP_Query($args); ?> <!-- il ciclo ecc.. --> <?php // Impaginazione $ grande = 999999999; // serve un numero intero improbabile echo paginate_links( array( 'base' => str_replace($grande, '%#%', esc_url(get_pagenum_link($grande))), 'formato' => '?paged=%#%', 'current' => max( 1, get_query_var('paged') ), 'totale' => $the_query->max_num_pages ) );
Conclusione
In questo post, abbiamo evidenziato i diversi tipi di impaginazione di WordPress e condiviso il codice di impaginazione specifico da utilizzare per ogni caso. Questo codice di impaginazione in WordPress può essere aggiunto a temi o plug-in esistenti e può anche essere aggiunto a WordPress come plug-in autonomo.