Come funziona il Loop di WordPress

Rocco Vincycontrollo genitori, tema wordpress

In questo articolo tratteremo la funzione PHP più importante di WordPress. Quella che viene usata per elaborare i post da mostrare al visitatore secondo i criteri del tema corrente. In pratica, vedremo insieme cos’è, come funziona e come usare il Loop di WordPress.

“In informatica, il loop è una successione di istruzioni compiute dall’elaboratore che vengono ripetute in modo ciclico fin quando non si verifica una determinata condizione”.

Il Loop di WordPress fa proprio questo. Cioè, recupera le informazioni riguardanti i post dal database ed esegue le azioni definite dal tema all’interno di un ciclo.

Quando abbiamo parlato dei Template Tags, abbiamo detto che molti di loro devono essere usati all’interno del Loop, altrimenti non funzionano.

Infatti, consultando la documentazione di un particolare Template Tags potremmo trovare la dicitura “Questo Tag dev’essere usato solo all’interno del Loop”. Ciò vuol dire che quel particolare Tags potrà essere usato solo nel Loop e sarà ripetuto per ogni post recuperato dal database.

Per esempio, alcuni dei template tags che possono essere usati solo nel Loop e che abbiamo già accennato sono: the_title(), the_category(), the_content() ecc…

Il Loop di WordPress: come funziona

Normalmente il Loop è usato in tutti i Template Files, sia quelli che visualizzano un singolo post o un pagina che quelli che si occupano di mostrare un archivio, come per esempio gli articoli contenuti in una determinata categoria.

Il Template Files index.php è un ottimo esempio che possiamo usare per imparare il funzionamento del Loop. Infatti, come abbiamo visto quando abbiamo parlato della gerarchia di WordPress, se non è presente un template file specifico per quel particolare contenuto, WordPress esegue index.php. Oltre al fatto che viene eseguito anche se l’utente non richiede alcun contenuto specifico.

Quindi, index.php dev’essere implementato in modo tale da visualizzare qualsiasi contenuto. Per cui, lo possiamo usare come punto di partenza da dove partire per sviluppare l’intero tema.

Ora, poiché stiamo per realizzare il primo esempio base di un tema personalizzato di WordPress partendo zero, ti consiglio di:

accedere alla cartella wp-content/themes
creare una directory alla quale darai il nome del tuo tema
creare all’interno di questa directoy i file style.css, seguendo le indicazioni che abbiamo già visto, e index.php

Inoltre, come abbiamo già detto, tieni presente che i temi wordpress hanno una struttura modulare e sono divisi in più files, quindi sarebbe opportuno creare anche i file header.php e footer.php.

Un possibile esempio base di header.php potrebbe essere:

<!doctype html>
<html <?php language_attributes(); ?>>
<head>
<!-- Required meta tags -->
<meta charset="<?php bloginfo( 'charset' ); ?>">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<?php wp_head(); ?>
</head>
<body>

Mentre un possibile esempio molto semplice di footer.php potrebbe essere:

<?php wp_footer(); ?>
</body>
</html>

Naturalmente tutti questi file si devono trovare all’interno della directory principale del tema e non in una sua sottocartella.

Come implementare il Loop

Vediamo ora come implementare il Loop di WordPress in index.php.

Il codice con il quale inizia il loop è:

<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>

E termina:

<?php endwhile; else : ?>
<p><?php esc_html_e( 'Sorry, no posts matched your criteria.' ); ?></p>
<?php endif; ?>

Quindi vediamo cosa succede se scriviamo il seguente codice all’interno di index.php e lo facciamo eseguire:

<?php
get_header();
if ( have_posts() ) :
    while ( have_posts() ) : the_post(); 
?>
        <h2 id="post-<?php the_ID(); ?>">
            <a href="<?php the_permalink() ?>"><?php the_title(); ?></a>
        </h2>
<?php
        the_content();
    endwhile;
else :
    _e( 'Sorry, no posts matched your criteria.', 'textdomain' );
endif;
get_footer();
?>

Questo semplice codice non fa altro che mostrare il titolo e il contenuto degli ultimi n articoli pubblicati nel sito. Cioè non mostrerà tutti i post presenti all’interno del database, ma un numero limitato n.

Per conoscere il valore di n, accedi alla dashboard del sito come amministratore e vai su impostazioni -> lettura. Il suo valore è quello indicato in corrispondenza di “Le pagine del blog visualizzano al massimo”.

Cliccando su uno dei titoli degli articoli elencati, accedi al singolo articolo e ti verrà mostrato solo il titolo e il contenuto di quell’articolo.

Ma cerchiamo di capire più in dettaglio cosa fa e come funziona il loop WordPress.

Innanzitutto, la prima cosa che notiamo è che il codice che abbiamo appena scritto, inizia e finisce con i template tags get_header() e get_footer()(fuori dal loop), il cui compito è quello di includere nel tema rispettivamente header.php e footer.php.

Subito dopo inizia il loop:

la prima istruzione è if (have_posts()) che si occupa di verificare se attraverso l’URL richiamata dal visitatore ci sono post da visualizzare. Nel caso in cui non ci dovessero essere post, mostra il messaggio “Sorry, no posts matched your criteria.”
Se ci sono post da mostrare, allora viene eseguito il ciclo while( have_posts()).
La funzione the_post() mette a disposizione il contenuto del post preparando tutte le variabili che saranno usate dai vari template tags. Oltre a spostare il puntatore al post successivo, modo che alle successive chiamate delle funzioni have_posts() e the_post() sarà prelevato il post successivo. Qualora non fosse richiamata la funzione the_post(), potrebbe generarsi un errore e il ciclo while potrebbe essere eseguito all’infinito.

I template tags di WordPress

All’interno del Loop del codice che abbiamo usato sono presenti i seguenti template tags:

the_ID() per ottenere l’id dell’articolo;
the_permalink() per ricavare l’URL dell’articolo, così come specificato in Impostazioni -> permalink;
the_title() per ottenere e stampare il titolo;
e in fine the_content() per mostrare il contenuto dell’articolo.

Per quanto riguarda la funzione the_content(), devi sapere che si comporta in modo diverso a seconda se viene eseguita in un archivio o in un singolo articolo.

In pratica, se per esempio il ciclo loop viene usato per recuperare gli articoli di una determinata categoria e in alcuni articoli è stato usato il tag <!–more–>, il suo contenuto sarà mostrato fino a quel punto e sarà aggiunto un link che punta all’url dell’articolo.

In sostanza, il tag <!–more–> presente nell’editor di testi di WordPress, permette di definire una porzione di articolo da visualizzare come eventuale incipit/introduzione. Quindi, il contenuto sarà mostrato per intero solo cliccando sull’apposito collegamento ipertestuale o se il visitatore si collega direttamente all’url dell’articolo in questione.

Aggiungere la paginazione alla fine del Loop

Come abbiamo visto, WordPress mostra un numero limitato di post partendo dal più recente. Per cui è opportuno aggiungere una paginazione alla fine del loop che permette di visualizzare sia i post precedenti che quelli successivi.

Per farlo è sufficiente aggiungere al termine del loop, dopo endwhile; il seguente funzione: posts_nav_link().

Per migliorane la visualizzazione, per ora, piuttosto che aggiungere semplicemente posts_nav_link(), si potrebbe centrare il contenuto che genera in questo modo:

<div style="text-align:center;">
<?php posts_nav_link( ' · ', 'previous page', 'next page' ); ?>
</div>

Per un corretto funzionamento del template tag, ti consiglio di consultare la documentazione ufficiale di posts_nav_link().

Conclusioni

Per concludere ti mostro il codice base del loop di WordPress che può essere usato in un qualsiasi template file.

<?php if (have_posts()) : ?>
<!-- START LOOP -->
<?php while (have_posts()) : the_post(); ?>
<!-- BEGIN POST -->
... 
...
<!-- END POST -->
<?php endwhile; ?>
<!-- END LOOP -->
<?php endif; ?>

Ti consiglio di copiarlo all’interno dei tuoi template files, di completarlo e di esercitarti facendo delle prove.

Nel frattempo, se hai dubbi o per qualsiasi informazione o chiarimento puoi scrivermi attraverso la nostra pagina Facebook di BlogAmico, o contattarmi via email.

Prossimo articolo -> Functions.php – Aggiungere caratteristiche e funzionalità a WordPress

I template tags di WordPress <- Articolo precedente