Come creare un tema child WordPress: guida pratica per personalizzare senza rischi
Hai mai perso tutte le personalizzazioni del tuo tema WordPress dopo un aggiornamento? È una delle situazioni più frustranti per chi gestisce un sito. La soluzione esiste e si chiama tema child (o tema figlio): un tema che eredita tutto dal tema principale ma ti permette di aggiungere modifiche che non verranno mai sovrascritte dagli aggiornamenti. In questa guida ti spiego come creare un tema child WordPress da zero, passo dopo passo, anche se non hai esperienza di sviluppo.
Cos’è un tema child e perché ti serve
Un tema child è un tema WordPress che funziona in coppia con un tema genitore (parent theme). Il child theme non contiene tutto il codice del tema: eredita automaticamente stili, template e funzionalità dal genitore. Tu aggiungi nel child theme solo le modifiche che vuoi apportare.
Perché è importante:
- Protegge le personalizzazioni: quando aggiorni il tema genitore, i file del child theme restano intatti. Le tue modifiche CSS, i template personalizzati e le funzioni PHP non vengono toccati.
- Permette modifiche sicure: puoi sperimentare senza rischiare di rompere il tema principale. Se qualcosa va storto, basta eliminare il file dal child theme.
- Best practice riconosciuta: è il metodo raccomandato ufficialmente da WordPress per qualsiasi personalizzazione del tema.
Senza un child theme, hai due opzioni poco appetibili: modificare direttamente il tema genitore (e perdere tutto al prossimo aggiornamento) oppure non aggiornare mai il tema (e restare esposto a vulnerabilità di sicurezza). Il child theme elimina questo dilemma. Creare un child theme richiede meno di 5 minuti e ti fa risparmiare ore di lavoro perso nel lungo periodo.
Passo 1: crea la cartella del tema child
Un tema child richiede al minimo solo due file. Collegati al server via FTP o dal file manager del tuo hosting e vai nella cartella wp-content/themes/. Crea una nuova cartella con un nome descrittivo, ad esempio:
- Se il tema genitore si chiama flavor, crea flavor-child
- Se il tema genitore è flavflavor, crea flavor-child
La convenzione è usare il nome del tema genitore seguito da -child.
Passo 2: crea il file style.css
All’interno della cartella del child theme, crea un file style.css con questa intestazione:
/* Theme Name: Flavor Child Theme URI: https://tuosito.it Description: Tema child personalizzato per Flavor Author: Il tuo nome Author URI: https://tuosito.it Template: flavor Version: 1.0.0 */
La riga fondamentale è Template: deve corrispondere esattamente al nome della cartella del tema genitore (attenzione alle maiuscole). È questo che dice a WordPress quale tema usare come base. Sotto l’intestazione puoi aggiungere il tuo CSS personalizzato:
/* Le tue personalizzazioni CSS */
h1 {
color: #333333;
}
.site-header {
background-color: #f5f5f5;
}
Passo 3: crea il file functions.php
Il secondo file obbligatorio è functions.php. Il suo scopo principale è caricare correttamente gli stili del tema genitore:
<?php
// Carica gli stili del tema genitore e del child theme
function flavor_child_enqueue_styles() {
wp_enqueue_style('parent-style',
get_template_directory_uri() . '/style.css');
wp_enqueue_style('child-style',
get_stylesheet_directory_uri() . '/style.css',
array('parent-style'));
}
add_action('wp_enqueue_scripts',
'flavor_child_enqueue_styles');
Questo codice carica prima il CSS del tema genitore e poi il CSS del child theme, permettendo alle tue regole CSS di sovrascrivere quelle del genitore. È importante usare wp_enqueue_style() anziché @import nel CSS: è più performante e il metodo raccomandato da WordPress.
Passo 4: attiva il tema child
Ora che hai i due file, il child theme è pronto. Vai nel pannello WordPress in Aspetto → Temi: dovresti vedere il tuo child theme nella lista. Clicca “Attiva”. Il sito manterrà esattamente lo stesso aspetto di prima, perché il child theme eredita tutto dal genitore. Da questo momento in poi, ogni personalizzazione andrà fatta nel child theme.
Se il child theme non appare nella lista, verifica che:
- Il valore di Template nel file style.css corrisponda esattamente al nome della cartella del tema genitore.
- Il file style.css abbia l’intestazione formattata correttamente (senza spazi iniziali o BOM UTF-8).
- La cartella sia nella posizione giusta: wp-content/themes/nome-child/.
Come personalizzare i template del tema
Il child theme non serve solo per il CSS. Puoi sovrascrivere qualsiasi file template del tema genitore semplicemente copiandolo nella cartella del child theme con lo stesso nome e la stessa struttura di cartelle.
Esempio pratico: vuoi modificare il layout dell’header.
- Trova il file header.php nella cartella del tema genitore.
- Copialo nella cartella del child theme: flavor-child/header.php.
- Modifica la copia nel child theme. WordPress userà automaticamente la tua versione al posto dell’originale.
Questo funziona per qualsiasi file template: footer.php, single.php, page.php, archive.php, eccetera. Se un template si trova in una sottocartella nel tema genitore (es. template-parts/content.php), ricrea la stessa struttura di cartelle nel child theme.
Aggiungere funzionalità PHP personalizzate
Il file functions.php del child theme viene caricato prima di quello del genitore. Questo ti permette di aggiungere hook, filtri e funzioni personalizzate. Alcuni esempi pratici:
Aggiungere un Google Analytics
function child_add_analytics() {
echo '<!-- Google tag (gtag.js) -->';
echo '<script async src="...">';
// Il tuo codice di tracciamento
}
add_action('wp_head', 'child_add_analytics');
Rimuovere un elemento del genitore
// Rimuovi la sidebar dalla pagina prodotto
function child_remove_sidebar() {
if (is_product()) {
remove_action('flavor_sidebar',
'flavor_get_sidebar');
}
}
add_action('wp', 'child_remove_sidebar');
Aggiungere dimensioni immagine personalizzate
function child_custom_image_sizes() {
add_image_size('card-thumb', 800, 450, true);
}
add_action('after_setup_theme',
'child_custom_image_sizes');
Ogni funzione che aggiungi nel functions.php del child theme sopravviverà agli aggiornamenti del tema genitore.
Errori comuni da evitare con i temi child
- Non copiare TUTTI i file del genitore nel child: copia solo quelli che devi modificare. Se copi tutto, le future correzioni nel tema genitore non avranno effetto perché WordPress userà sempre la versione del child.
- Non modificare il tema genitore: il child theme esiste proprio per questo. Se modifichi anche solo una riga nel genitore, la perderai all’aggiornamento.
- Attenzione al nome della funzione: se il functions.php del genitore definisce funzioni con if (!function_exists()), puoi sovrascriverle nel child. Altrimenti, otterrai un errore PHP per funzione duplicata.
- Testa dopo ogni aggiornamento del genitore: un aggiornamento del tema genitore potrebbe cambiare la struttura HTML dei template, rendendo il tuo CSS personalizzato inefficace. Verifica sempre il sito dopo l’aggiornamento.
Plugin alternativi per creare un child theme senza codice
Se preferisci non creare i file manualmente, esistono plugin che automatizzano il processo:
- Child Theme Configurator: crea il child theme con un’interfaccia grafica, analizza il tema genitore e genera automaticamente i file necessari.
- WP Child Theme Generator: crea il child theme con un clic e permette di personalizzare le opzioni direttamente dal pannello.
Questi plugin sono utili per iniziare, ma per personalizzazioni avanzate dovrai comunque modificare i file manualmente. Un consiglio: dopo aver creato il child theme con un plugin, puoi disinstallare il plugin stesso perché il child theme continuerà a funzionare indipendentemente.
Hai bisogno di personalizzazioni avanzate? Ti aiutiamo noi
Se hai bisogno di modifiche complesse al tema, integrazioni personalizzate o vuoi creare un child theme per un progetto articolato, il team di SoccorsoWP può assisterti. Creiamo child theme su misura, ottimizziamo il codice e ci assicuriamo che le personalizzazioni funzionino perfettamente con gli aggiornamenti futuri del tema genitore. Apri un ticket e affida le personalizzazioni a chi le fa ogni giorno.
