Non Modificare il Loop di index.php!!!

Ecco uno di quegli articoli che leggerai con interesse o che ignorerai del tutto data la sua semplicità. Sicuramente gli sviluppatori più smaliziati conoscono bene la struttura dei file WordPress e sanno come sfruttarla a proprio piacimento; ma non siamo tutti nati imparati.

Quest’oggi voglio parlare di un argomento che è veramente semplice ma che fin troppe volte mi sono trovato a parlarne all’interno delle consulenze e del nostro forum. Sembra una cosa strana, ma spesso si dimentica che il file index.php è il file principale che WordPress usa per la generazione di tutte le pagine che compongono il sito.

Come dovresti aver già scoperto, la nostra piattaforma preferita ci permette di organizzare la struttura delle nostre pagine e dei nostri articoli in maniera diversa. In alcuni casi potrai andare a modificare il tuo codice utilizzando delle funzioni particolari che prendono il nome di Conditional Tags, altre volte possiamo creare un file .php, con un nome ben preciso, che ci permetterà di creare la struttura che preferiamo.

Se conoscevi già questi concetti mi posso soltanto congratulare con te ma, dato che sempre più persone si approcciano allo sviluppo WordPress, ho pensato bene di approfondire leggermente questo argomento.

Prima di poter capire a fondo perché non dovresti modificare il ciclo WordPress che si trova all’interno di index.php è bene fare luce su alcuni aspetti che ti permetteranno di conoscere ancora meglio la nostra amata piattaforma.

Specifica la struttura che desideri

WordPress è un CMS veramente potente, grazie all’elasticità con la quale è stato sviluppato è in grado di adattarsi ad un gran numero di situazioni. Se ancora non hai visto la lezione Comprendi la gerarchia di un tema WordPress, al suo interno ho cercato di farti capire il ragionamento che viene fatto dalla nostra piattaforma nel momento in cui si trova a dover generare una pagina dentro il browser del visitatore.

Ad essere onesti è possibile creare un tema con soltanto cinque file, WordPress è in grado di generare qualsiasi pagina utilizzando soltanto i file: header.php, index.php, sidebar.php, footer.php senza dimenticarci di aggiungere un po’ di stile alle nostre pagine grazie a style.css.

Se sei andato a vedere la lezione a cui faccio riferimento, al suo interno si capisce che WordPress sceglie i file .php da utilizzare in base al loro nome, per rendere più chiaro il tutto facciamo qualche esempio:

• Se ti trovi a visualizzare una pagina archivio (una qualsiasi pagina archivio presente nel CMS) il file PHP incaricato di dare struttura e di richiamare i contenuti all’interno del database è proprio il file archive.php, se questo file non è presente verrà controllata la struttura all’interno di index.php.
• Se stai leggendo un articolo, il file che viene consultato si chiama single.php e, nel caso non sia presente nella cartella del nostro tema, ancora una volta sarà scelto index.php per dare forma ai contenuti presenti all’interno dell’articolo.
• Stessa cosa succede con le pagine. Diciamo che per esempio il tuo visitatore sta leggendo la tua pagina contatti che cosa fa WordPress? Beh cerca la presenza del file page.php ed in sua assenza andrà a richiamare index.php.

Ovviamente la piattaforma WordPress presenta molti altri file che potranno essere creati per personalizzare la struttura dei contenuti che dovrà mostrare e tutto è spiegato nel dettaglio nella lezione che ti ho collegato precedentemente. Facendo un esempio veloce, anche qua su SkillsAndMore stiamo personalizzando la struttura delle pagine che contengono l’archivio dei corsi, il singolo corso e le singole lezioni grazie a file che prendono i seguenti nomi:

• archive-course.php che personalizza la pagina di archivio dei corsi;
• single-course.php per la creazione della pagina che inserisce la descrizione del corso e la lista delle lezioni contenute al suo interno;
• single-lesson.php dove personalizzo la struttura della singola lezione offrendo anche i link per fare i quiz interni e passare velocemente alle lezioni successive.

Insomma, WordPress permette di personalizzare incredibilmente i nostri contenuti e se vuoi creare un tema professionale in grado di soddisfare le necessità del tuo cliente mantenendo delle prestazioni elevate ti consiglio proprio di seguire il nostro corso. È il modo migliore per avere tutte le informazioni necessarie organizzate e contenute all’interno di un singolo percorso.

Conditional Tags

Se non lo sapevi ancora, hai appena scoperto che WordPress segue una logica ben precisa nella generazione delle sue pagine, ci permette di andare a modificare nei minimi particolari aspetti dedicati senza dover essere dei maghi della programmazione (basterà dare il nome correto al file che stiamo creando), sarà poi il CMS che si occuperà di prendere la struttura che hai definito e applicarla alla pagina generata in modo del tutto automatico!

Capita però che creare nuove pagine PHP sembri una cosa molto impegnativa, soprattutto se si ha bisogno soltanto di modificare una piccola porzione di codice, magari la modifica che vuoi fare riguarda soltanto elemento HTML.

Cerchiamo di fare un esempio pratico per capire al meglio, che ne dici?

Nella nostra situazione ideale vogliamo che nella home del sito, il nostro logo sia contenuto all’interno di un h1, ovvero, inseriremo del testo che viene letto bene dai motori di ricerca e che verrà sostituito con una immagine attraverso le regole CSS. Io uso spesso questa tecnica perché non ho ancora letto che questa pratica è sbagliata, ma devi farlo con attenzione.

Cosa succede se lasci il tuo logo contenuto in un h1 all’interno di tutte le tue pagine? Incontri un problema considerato abbastanza seriamente da Google perché non stai cambiando il titolo della tua pagina in base al contenuto e per questo il motore di ricerca non è in grado di indicizzare nel modo corretto il tuo contenuto o, peggio ancora, ti penalizzerà per questo.

Come puoi fare quindi per cambiare questa situazione? Come puoi dire che in una determinata pagina il nostro logo è un titolo mentre in un altra una semplice immagine? Beh per fortuna nostra WordPress ci ha già pensato e ci ha fornito i Conditional Tag, vediamo un piccolo esempio:

<?php
    if( is_home() || is_front_page() ) :
?>
    <h1 id="logo">SkillsAndMore</h1>
<?php
    else :
?>
    <img src="percorso/immagine.png" />
<?php
    endif;
?>

Come puoi notare, all’interno del file header.php, io sto sfruttando la possibilità di chiedere a WordPress se ci troviamo in home o front page, in questo modo ho la possibilità di inserire un titolo h1 (perfetto per indicizzare il nome del mio sito) soltanto in questo tipo di pagine; se l’utente sta consultando una pagina differente allora mostrerò una semplice immagine dato che il titolo che mi interessa indicizzare maggiormente è il titolo dell’articolo o della pagina caricata.

Questo vuol dire che all’interno del file single.php posso inserire tranquillamente un titolo di primo livello che contiene al suo interno il titolo dell’articolo, ma questo è soltanto un esempio.

Le possibilità che ci vengono offerte dai Conditional Tag sono molto utili anche all’interno del file functions.php dove possiamo anche decidere quali script (JavaScript o CSS) possiamo caricare in base alla pagina generata dal CMS 😉

Ma cosa c’entra tutto questo con index.php?

Se ti stai facendo questa domanda non hai tutti i torti, in fin dei conti ti ho parlato principalmente di due cose:

• la logica che segue WordPress nel richiamare determinati file
• e la possibilità di fare dei controlli su che tipo di pagina viene consultata.

Ancora non ti ho spiegato come mai non dovresti modificare il ciclo contenuto dentro index.php.

Se torni a leggere la descrizione e gli esempi che ti ho fatto più in alto, ormai dovrebbe essere chiaro che questa pagina, in mancanza di file .php adeguati, il file index.php è quello incaricato a mostrare il contenuto che il nostro visitatore vuole consultare.

Se qualcuno clicca sul link di un mio articolo si aspetta di leggere il testo completo, se presente, il suo contenuto verrà mostrato all’interno della struttura in single.php, ma se questo file non si trova all’interno della cartella del nostro tema verrà consultata la struttura presente in index.php.

È importante notare che il ciclo all’interno di questo file deve essere il classico ciclo WordPress perché, come già visto altre volte, questo è anche in grado di capire cosa vuol leggere il visitatore in base alla pagina richiesta, proprio come nel caso del contenuto del singolo articolo. Se invece vado a inserire un ciclo personalizzato come questo all’interno di index.php:

<?php
    $args = array(
        'post_type' => 'page'
    );

    $loop = new WP_Query();
    if( $loop->have_posts() ):
        while( $loop->have_posts() ) : $loop->the_post();
?>
    <!-- Struttura Contenuto -->
<?php
        endwhile;
    endif;
?>

Quello che sto facendo è dire a WordPress di ignorare completamente la richiesta del visitatore e lo costringerlo a creare un nuovo loop che andrà a mostrare le pagine contenute all’interno della nostra installazione e questo non è assolutamente quello che si aspettava il lettore!

Se vuoi personalizzare il tuo index.php per inserire altri loop personalizzati è una cosa che puoi fare tranquillamente, ma è necessario che sia presente anche il loop classico di WordPress perché in questo modo potrà rispondere correttamente alla richiesta del tuo visitatore:

<?php
    if( have_posts() ):
        while( have_posts() ) : the_post();
?>
    <!-- Struttura Contenuto -->
<?php
        endwhile;
    endif;
?>

Conclusioni

Come ti ho annunciato fin dall’inizio, molto probabilmente queste erano cose che conoscevi già o dove hai già sbattuto la testa diverse volte, ma non potevo perdere l’opportunità di approfondire maggiormente questo argomento e far capire l’importanza essenziale del file index.php.

Comprendere il comportamento del Loop WordPress e sapere come si comporta di fronte a situazioni diverse è sicuramente qualcosa che velocizzerà il tuo sviluppo e che ti permetterà di fare meno errori, cose importantissime quando abbiamo delle scadenze immediate o semplicemente non vogliamo perdere delle ore preziose.

Probabilmente adesso sei rimasto con una domanda: come personalizzo la mia homepage?

La risposta è molto semplice, non devi far altro che creare il file front-page.php, in questo modo WordPress saprà che il codice contenuto al suo interno serve esclusivamente a creare la homepage del tema che stai realizzando. In questo modo potrai creare tutti i looop personalizzati che desideri e dare alla pagina principale del tuo sito web un aspetto presonalizzato senza rischiare di compromettere quello delle altre pagine.

Man mano che incontrerò nuove bad practice tornerò qua a parlartene, ma potresti darmi una mano segnalandomi nei commenti le cose che per te sono state, o sono tutt’ora, difficili da comprendere all’interno del comportamento di WordPress. I dubbi più interessanti verranno approfonditi in articoli specifici e ti verrà dato pieno credito per la tua richiesta (sempre se lo desideri).

Grazie per aver letto questo articolo, mi fa veramente piacere, e ricorda di segnalarlo a qualche collega o amico che sta facendo lo stesso errore (o che potrebbe farlo), sono sicuro che anche lui ti sarà eternamente grato 😉