Come creare un tema child per WordPress

Un tema figlio (child theme) è un tema che eredita la funzionalità e lo stile di un altro tema, chiamato tema padre o tema genitore (parent theme). I temi figli sono non solo il metodo consigliato di modificare un tema esistente, ma sicuramente sono di gran lunga il modo più sicuro e semplice per farlo. Così, anziché modificare direttamente i file del tema, puoi adottare l’utilizzo di un tema child che per sua natura eredita tutti i template e funzionalità del suo diretto genitore, ma sovrascrivendo i file dello stesso.
- Leggi l'articolo, ti bastano solo 1 minuto, 24 secondi
Sei di fretta? Scarica il PDF e consultalo quando vuoi!
Sommario
1 Perché usare un tema child |
2 Come creare un tema child |
3 Ereditare dal tema genitore |
4 File e override |
5 Come attivare un tema child |
6 Commenti |
Perché usare un tema child
Ma perché creare un tema child? Perché creare un altro tema per apportare delle modifiche e non modificare direttamente il tema genitore?
Il problema nasce principalmente quando si utilizza un tema di terze parti, acquistato ad esempio su marketplace come themeforest. Di tanto in tanto, i temi possono ricevere degli aggiornamenti, molto importanti perché possono:
- Aggiungere nuove funzionalità
- Correggere bug
- Migliorare la sicurezza o correggere eventuali falle
- Aggiornare la compatibilità con nuove versioni di WordPress
Ma aggiornando il tema, i file della nuova versione sostituiscono i precedenti ed ogni eventuale modifica ai file dello stesso, andrebbe persa.
Creando un tema child, invece, il tema padre può essere aggiornato e le tue personalizzazioni resteranno invariate nel tema figlio.
Inoltre, un tema child per WordPress permette agli sviluppatori di avere una base di partenza fissa (parent) con eventuali diverse ramificazioni differenti tra loro (child), incrementando così la velocità di sviluppo e la riutilizzabili del codice.
Come creare un tema child
Il processo di creazione di un tema child per WordPress è davvero molto semplice, eccolo punto per punto:
1. Entra nella cartella contenente i temi di WordPress:
wp-content/themes/
2. Crea una nuova cartella, convenzionalmente chiamata con lo stesso nome del tema genitore seguito dal suffisso -child.
Ad esempio, per creare un tema child per il tema di default Twenty Seventeen, il nome sarà:
twentyseventeen-child
3. All’interno della nuova cartella, crea un file chiamato style.css.
Questo file è l’unico strettamente necessario per permettere al tema child di funzionare.
4. Modifica il file style.css appena creato, inserendo al suo interno le righe di codice:
/* Theme Name: TwentySeventeen Child by Code4Life Theme URI: https://code4life.it/ Description: Tema Child per il tema TwentySeventeen Author: Code4Life Author URI: https://code4life.it/ Template: twentyseventeen Version: 1.0.0 */
Tieni a mente che le uniche righe obbligatorie, sono:
Theme Name, che indica il nome che desideri dare al tuo tema child;
Template, che indica il tema genitore da cui ereditare le funzionalità (va indicato il nome della cartella in cui si trova il tema padre).
Le operazioni principali sono terminate, il tuo tema child è già pronto per essere utilizzato!
Ereditare dal tema genitore
È bene precisare che quando procederai ad attivare il tuo nuovo tema child per WordPress, il foglio di stile utilizzato dal CMS sarà quello del child. Ma se il foglio di stile del tema padre contenesse regole CSS necessarie alla corretta visualizzazione della grafica?
In questo caso, è possibile (ed è consigliato) includere il foglio di stile del tema genitore nel tema child, così da garantire al 100% l’ereditarietà. Per farlo, entra nella cartella del tuo tema child e crea un nuovo file, chiamato functions.php, inserendo il seguente codice:
<?php // Aggiunge il foglio di stile del tema parent add_action( 'wp_enqueue_scripts', function() { wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' ); } );
File e override
L’utilizzo dei temi child di WordPress, prevede un sistema di override dei file. Ma cosa significa?
Vuol dire, in poche parole, che i file presenti nel tema child andranno a sovrascrivere i file del tema genitore. Ad esempio, quando WordPress cercherà i file di template, come il file page.php, lo cercherà prima nel tema child, altrimenti lo andrà a prelevare dal tema parent. Quindi, per fissare il concetto, i file del tema child hanno la priorità rispetto ai propri omologhi presenti nel tema genitore. Naturalmente, questo discorso vale per ogni file del tema.
Fa eccezione però il file functions.php; in questo caso, il file viene caricato da entrambi i temi, nella sequenza: figlio, padre.
Ricapitolando, quando viene richiamata una pagina di WordPress con un tema child attivo, viene richiamato il file functions.php del tema child, poi il file functions.php del tema genitore, poi via via gli altri file dal tema child, se presenti, altrimenti dal tema genitore.
Bene, ora non ci resta che procedere con l’attivazione del nostro tema child.
Come attivare un tema child
Attivare un tema child per WordPress è un’operazione estremamente semplice e non differisce di una virgola dalla normale procedura di attivazione di un qualsiasi altro tema.
Accedi quindi al backend del tuo sito WordPress e portati nella sezione:
Aspetto > Temi
seleziona il tema child appena creato e clicca su “Attiva”… Fatto? Perfetto! Ora non ti resta che mettere in pratica tutte le personalizzazioni al tema che preferisci.