Creare un tema child su WordPress è un’operazione tanto semplice quanto essenziale, che qualsiasi webmaster dovrebbe effettuare sul proprio sito per risparmiare tempo e fatica (e anche per organizzare meglio il proprio lavoro!).
Ecco cos’è e come funziona:
Cos’è un tema child?
Citando testualmente il Codex di WordPress:
Un tema figlio in WordPress è un tema che eredita le funzionalità di un altro tema, denominato tema genitore e che vi permette di modificare o di aggiungere funzionalità del tema genitore.
Quindi si tratta, in soldoni, della “copia” di un tema che abbiamo già installato, la quale eredita tutte le caratteristiche del tema padre e viene caricata dopo di lui; di conseguenza sovrascrive le parti che vogliamo modificare.
Perché non modificare direttamente il tema originale?
Qualsiasi tema premium (ma il discorso vale anche per diversi temi free) viene frequentemente aggiornato dagli sviluppatori, che ne rilasciano nuove versioni per migliorarne la performance e adattarne la configurazione agli aggiornamenti di WordPress.
Quando aggiorniamo un tema i nuovi file inevitabilmente sovrascrivono quelli vecchi, portandoci a perdere tutte le modifiche e le personalizzazioni effettuate fino a quel momento.
I temi child servono proprio ad aggirare questo problema: non venendo intaccati dall’aggiornamento (e continuando a ereditare i file dalla directory padre) conservano intatte le modifiche anche a seguito di un update.
Sono utili anche agli sviluppatori stessi, che in tal modo possono utilizzare il tema di base come framework e personalizzare i diversi progetti attraverso i temi child.
Come creare un tema child WordPress
L’unico requisito obbligatorio che deve avere un tema child è il file style.css.
- Per prima cosa, tramite FTP, accedete alla directory wp-content/themes della vostra installazione di WordPress e create una nuova cartella, assegnandole il nome che preferite (può essere il nome del tema seguito dal suffisso -child o semplicemente il titolo del vostro sito).Attenzione: il nome della nuova cartella non deve contenere alcuno spazio.
- Create il file style.css da caricare nella cartella. Potete farlo attraverso qualsiasi editor di testo. Il requisito imprescindibile è che il file abbia la seguente intestazione:
/*
Theme Name: Sweet Child O' Mine
Theme URI: http://www.yourwebsiteurl.com
Author: Susanna Marsiglia
Author URI: http://www.susydrake.net
Description: Un tema child
Template: twentyfifteen
Version: 1.0
*/
Le sole due righe obbigatorie sono Theme name (il nome che volete assegnare al tema child che state creando) e Template.
Il Template è il nome della cartella contenente il tema genitore. In questo caso sto creando un tema child di Twenty Fifteen, perciò ho inserito “twentyfifteen” (che è il nome della directory contenente il tema) come template.Gli altri campi (opzionali) sono:
Theme URI: l’url del vostro tema (quindi del sito che state amministrando)
Description: una breve descrizione del vostro tema
Author: l’autore del tema
Author URI: il sito web dell’autore
Version: la versione del child che state creando (in questo caso, essendo il primo, 1.0)La sintassi /* e */ è obbligatoria, in quanto indica apertura e chiusura dell’header.
- Come ho appena spiegato, lo style.css che avete appena creato sovrascriverà quello del genitore. Ma visto che per il momento è bianco e che vogliamo mantenere gli stili del tema padre, occorre inserire un’altra riga nel documento subito dopo l’intestazione:
@import url(“../twentyfifteen/style.css”);
In tal modo direte a WordPress di importare il foglio di stile del tema padre e non ne perderete il contenuto con l’attivazione del child.
Salvate il file e caricatelo all’interno della cartella che avete appena creato.
Potete anche creare e caricare, sempre nella stessa cartella, un’immagine “di copertina” per il tema, che dovrà necessariamente chiamarsi screenshot.png e avere dimensioni 880x660px. - Accedete a WordPress e cliccate su Aspetto → Temi nella colonna di sinistra. Se avete seguito correttamente il procedimento dovreste veder comparire il vostro nuovo tema child nell’elenco:
Cliccando su “Anteprima” dovreste vedere il sito con l’aspetto del tema padre, avendo importato i suoi stili CSS.
- A questo punto, se tutto è corretto, potete attivare il tema e iniziare a personalizzarlo attraverso l’editor di WordPress (Aspetto → Editor) inserendo i vostri stili nello style.css sotto la riga dell’import.
Come sovrascrivere le pagine?
Ovviamente potreste voler personalizzare non solo le classi CSS, ma anche la struttura di alcune pagine del tema genitore.
Per farlo è sufficiente scaricare tramite FTP la pagina che volete modificare, caricarla nella cartella del tema child e applicare le modifiche tramite l’editor di WordPress. Esattamente come per il CSS, questa sovrascriverà la pagina originaria.
L’unico file che non viene sovrascritto, ma anzi viene caricato prima di quello del genitore, è il functions.php.
Non dovrebbero comunque sussistere problemi, visto che la maggior parte dei temi premium ha funzioni condizionali, quindi sovrascrivibili da un child.
Con questo procedimento potrete aggiornare il vostro tema senza problemi e senza dovervi preoccupare di backuppare le modifiche di volta in volta.