Categorie
Tutorial WordPress WordPress

Realizzare un child theme per WordPress

Tra le domande cui mi trovo più spesso a rispondere ci sono queste due: «quando conviene realizzare un tema figlio» per un sito WordPress, e «come si fa»? Le risposte in breve sono queste: «si, sempre» e «è molto facile».

Introduzione

In questo articolo proverò a spiegare perché è preferibile utilizzare un tema figlio quando si utilizza WordPress e vi mostrerò il codice minimo indispensabile per realizzarne uno.

Da questo articolo ho registrato un video:

Che cosa è un child theme

Un child theme, che alcuni hanno tradotto in italiano come tema figlio, è un tema di WordPress che eredita tutti i file da un altro tema.

Possiamo riferirci al tema da cui stiamo ereditando tutti i file come tema genitore, o parent theme.

Possiamo pensare al tema genitore come una base, e utilizziamo il tema figlio per apportare delle piccole modifiche.

Uno degli utilizzi del tema figlio potrebbe essere la declinazione di un tema generico per adattarlo a una specifica nicchia, infatti molti sviluppatori di temi hanno una base comune che utilizzano come tema genitore nel loro lavoro e sviluppano più di un tema figlio per realizzare template specifici per settore.

Un utilizzo molto più comune è quello di chi scarica un tema realizzato da altri e desidera adattarlo alle proprie specifiche esigenze.

Perché conviene sempre realizzare un child theme

Quando si utilizza un tema realizzato da altri come base del proprio lavoro si ha spesso l’esigenza di apportare delle piccole modifiche per meglio adattarlo alle esigenze del caso specifico.

Una pratica da evitare assolutamente è la modifica dei file di un tema mantenuto da terzi, anche se la licenza ce lo permetterebbe.

Il motivo principale per cui è sconsigliato modificare i file di temi e plugin mantenuti da altre persone, così come anche i file del core del CMS WordPress, è che al primo aggiornamento perderemmo ogni modifica.

Certo, esistono dei sistemi per evitare gli aggiornamenti, ma chi vorrebbe un sito non aggiornabile in cui le falle di sicurezza non vengono mai risolte?

Uno dei vantaggi del software libero è che il codice è sottoposto a moltissima manutenzione ed è opportuno scaricare tutti gli aggiornamenti consigliati dall’autore del software e dalla comunità.

Come si realizza un child theme per WordPress

Sono sufficienti due file per realizzare un child theme, ma d’altronde sono sufficienti due file per realizzare un tema qualsiasi.

Per realizzare un tema per WordPress si procede nel seguente modo:

  • Si crea una cartella con un nome univoco all’interno di /wp-content/themes;
  • All’interno della cartella del tema si crea un file di nome index.php;
  • Sempre all’interno della stessa cartella si crea un file di nome style.css;
  • Infine si crea un file di nome functions.php sempre nello stesso posto.

Il nome della cartella che contiene i tre file non deve necessariamente essere uguale al nome del tema, ma è buona pratica usare un nome facile da riconoscere. Visto che realizzeremo un tema figlio del tema Twenty Twenty, la migliore scelta per il nome di questa cartella è twentytwenty-child.

Il file index.php

Il file principale del tema deve avere questo nome, in questo modo ogni pagina del sito avrà almeno un template da caricare.

Esiste la possibilità di creare diversi file per diverse necessità, ma per questo articolo ci atteniamo al minimo indispensabile perché il tema sia riconosciuto e caricato da WordPress.

Visto che realizzeremo un tema figlio possiamo anche non avere un file index.php: il nostro tema erediterà il file index.php dal tema genitore.

Il file style.css

Il file style.css deve contenere un commento in cima a tutto il testo, il suo contenuto minimo è questo:

/*
 Theme Name:   Il mio primo tema
*/

Questo commento rende disponibile un nome per il nostro tema e in questo modo WordPress sarà in grado di riconoscerlo e lo mostrerà all’interno della sezione Aspetto » Temi per gli amministratori del sito.

Ovviamente oltre al nome del tema possiamo utilizzare questo blocco di commenti per indicare molte altre proprietà del tema, ad esempio l’autore, il link al sito ufficiale, i requisiti di sistema per l’installazione, la licenza e così via.

Visto che si tratta di un file con estensione .css viene utilizzato come foglio di stile principale del sito, ma dovremo registrarlo se vogliamo che venga caricato.

Anche se è sufficiente indicare il nome del tema perché WordPress lo riconosca, occorre un’ulteriore informazione per indicare al CMS che questo tema è un figlio: bisogna indicare il nome del tema genitore:

/*
 Theme Name:   Il mio primo tema
 Template:     twentytwenty
*/

La proprietà Template dice a WordPress che questo tema eredita tutto dal genitore twentytwenty e che non può funzionare se questo tema genitore non è installato.

Il file functions.php

All’interno di ogni tema WordPress è presente questo file, anche se tecnicamente non è necessario che ci sia perché il tema funzioni, è poco utile realizzare un tema senza di esso, infatti tutto il codice inserito all’interno di questo file viene eseguito ad ogni richiesta di pagina.

Il contenuto minimo di questo file, in genere, è il codice che registra l’esistenza del foglio di stile style.css in modo che il CMS sia in grado di caricarlo.

/**
 * Si registra all’hook wp_enqueue_scripts per registrare il foglio di stile
 */
add_action( 'wp_enqueue_scripts', 'twentytwenty_child_enqueue_styles' );

/**
 * Questa funzione viene eseguita all’hook wp_enqueue_scripts
 */
function twentytwenty_child_enqueue_styles() {
 
    /// Il file style.css dal tema genitore 
    wp_enqueue_style(
        'twentytwenty-style',
        get_template_directory_uri() . '/style.css'
    );
    /// Il file style.css dal tema figlio
    wp_enqueue_style(
        'twentytwenty-child-style',
        get_stylesheet_directory_uri() . '/style.css',
        array( 'twentytwenty-style' ),
        wp_get_theme()->get('Version')
    );
}

Conclusione

Dato che è sufficiente creare una cartella con due file per avere un child theme non si può certo dire che si tratti di una cosa difficile da realizzare, ed è una buona abitudine farlo sempre per ottenere molti vantaggi:

  1. Quando si aggiorna il tema genitore non si perdono tutte le modifiche;
  2. Quando si ha la necessità di modificare un singolo template, ad esempio la vista archivio, o la vista singola pagina, basta copiare un file dal tema genitore al tema figlio;
  3. Quando si ha la necessità di tornare al template originale, quello del tema genitore, è sufficiente cancellare un file;
  4. Si mantiene separato lo sviluppo del tema genitore, multi purpose, da quello del tema figlio, altamente specializzato;
  5. Se qualcosa nell’interfaccia del sito si rompe è molto più facile identificare il punto in cui si trova il codice colpevole.

Insomma, spero che da oggi tutti quelli che hanno avuto la pazienza di leggere fino a qui avranno anche la pazienza di realizzare un child theme per ogni installazione.

Chi volesse scaricare un archivio zip instancabile con il child theme creato per questo articolo può farlo compilando questo modulo:

Inserisci nome e indirizzo email per iscriverti alla mia newsletter e ricevere il file immediatamente.
In breve: i dati inseriti in questo modulo saranno utilizzati per inviarti il link per scaricare il file che desideri, saranno conservati da un servizio esterno che si chiama MailChimp e in qualsiasi momento potrai cancellare la tua iscrizione al seguente link: https://danielealessandra.us7.list-manage.com/unsubscribe?u=546bebc381e525372d2120083&id=326af7d230.

Puoi leggere l'informativa completa cliccando sul link Privacy Policy che trovi dovunque su questa pagina, e comunque visitando in qualsiasi momento l'indirizzo https://www.danielealessandra.com/privacy-policy/
Ho letto e accetto l’informativa sulla privacy.

Se siete d’accordo fatemelo sapere nei commenti, se non siete d’accordo ditemi perché nei commenti.

Loading spinner

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *