Tema child WordPress: cos’è e come funziona

Se utilizzi spesso temi premium avrai sicuramente sentito parlare del tema child wordpress. Questo tipo di tema è fondamentale per apportare modifiche sia al tema che stai utilizzando che al suo css.

Scopriamo quindi cos’è un tema child e come funziona.

In cosa consiste il tema child WordPress 

Un tema child è un particolare tipo di tema che va ad ereditare tutta la struttura e la grafica dal parent theme (genitore). Ogni sviluppatore che si rispetti quando lavora su WordPress lo utilizza sempre perchè permette di modificare il sorgente del genitore senza andare a toccare i file originali.

In questo modo si potrà facilmente andare a sovrascrivere alcune cose che non ci piacciono senza poi andare a compromettere l’intera struttura.

Il tema child wordpress risolve così un problema che da anni tormenta i web developer che devono andare a mettere le mani sul codice di qualcun altro.

Non so se è capitato anche a te, ma lavorando su temi premium da modificare, mi è successo più di una volta che sostituendo alcune righe di codice in un file o alterando una classe del css per cambiare un’impostazione o l’aspetto di una determinata pagina, queste modifiche andavano poi a modificarne anche altre.

Con il tema child non si corre più questo rischio perchè il parent theme non viene mai toccato.

Un ulteriore vantaggio è quando occorre aggiornare la versione del tema genitore: utilizzando un child theme tutte le modifiche effettuate non andranno perse.

 

Installare il tema Child

Se ti stai chiedendo come creare un tema child, sappi che è veramente facile. Innanzitutto ti basterà andare all’interno della cartella wp-content/themes della tua installazione di WordPress.

Qui crea un nuova cartella e chiamala con il nome del tema di cui vuoi creare il figlio seguito da -child. Quindi se per esempio stai utilizzando il tema Uncode, il nome della tua cartella sarà uncode-child.

Questa sarà la cartella del tuo tema child, dove inserirai tutti i successivi file che andranno a sovrascrivere quelli del tema genitore.

All’interno della cartella appena creato, crea un nuovo foglio di stile con il nome style.css. Mi raccomando, deve avere per forza questo nome, perchè WordPress leggerà questo file per avere tutte le informazioni sul tema. Se inserirai un nome diverso avrai una segnalazione di errore.

Ora inserisci questo codice nel file style.css
/*
Theme Name: Nome del tema
Theme URI: http: //sito-del-tema (non obbligatorio)
Description: breve descrizione del tema  (non obbligatorio)
Author: il tuo nome o nickname (non obbligatorio)
Author URI: http://link-al-tuo-porfolio (non obbligatorio)
Template: nomedeltema
Version: es.1.0.0 (non obbligatorio)
Text Domain:  usato per le traduzioni (non obbligatorio)
*/

Il Theme Name è il nome che vuoi dare al tema: va bene inserire degli spazi, non comprometterà nessuna funzione di WordPress. In genere si inserisce il nome del parent theme seguito dalla parola Child.

Molto importante è il Template. Qui dovrai inserire lo stesso nome della cartella del parent theme. Questo dirà a WordPress che ciò che stai creando è un child di quel particolare tema. Questa informazione non contiene mai spazi, al massimo dei trattini, perciò occhio!

Il Text Domain è in genere usato per le traduzioni. Puoi ricopiare quello presente nel file style.css del parent theme.

Hai quasi finito. Ora bisogna creare il file functions.php.

Quindi sempre nella stessa cartella creare un nuovo file php e rinominalo functions.php.

All’interno di questo file l’unica cosa da fare è inserire la stringa di codice che vedi sotto per andare a dire a WordPress di caricare il foglio di stile del tema parent.

<?php
add_action( 'wp_enqueue_scripts', 'add_parent_theme_css_de34fxwp' );
function add_parent_theme_css_de34fxwp() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
}
?>

Bene! Se hai seguito tutti i passaggi hai un tema child completamente funzionante. Gabba hey!

 

Le modifiche del tema Child 

Sei ora pronto per iniziare a lavorare con il tuo tema con la totale sicurezza del genitore.

All’interno del backend vai su Aspetto>Temi e attiva il tuo tema child wordpress.

Per il gusto della completezza potresti anche inserire all’interno della cartella che hai creato un’immagine chiamato screenshot.png così che in Aspetto>Temi venga mostrata un’anteprima del tema.

Una volta attivato il child puoi iniziare a inserire codice sul tuo css, questi andranno a sovrascrivere quelli presenti sul tema parent. Ma questa è forse una delle funzionalità più banali. Il bello viene con il functions.php che hai creato poco fa.

Con questo file puoi andare a inserire nuove funzioni che saranno subito attive. Inoltre non verrà sovrascritto il functions del parent, quindi non dovrai ricopiare tutte le sue funzioni. Per farti capire le sue potenzialità pensa al caso in cui il cliente ti chiede di avere accesso al backend ma hai paura che possa cliccare qualcosa di sbagliato nella sua completa ignoranza di immigrato digitale.

Con il functions.php, tu che sei saggio, andrai a inserire delle funzioni particolari, specifiche per il suo tipo di user o proprio per il suo nome utente, nascondendo o eliminando delle sezioni del backend, impedendogli di fare danni.

Oppure con il functions puoi andare a creare nuovi widget e sidebar che saranno attivi solo quando avrai selezionato il tema child, ecc… ecc..

Come vedi le potenzialità sono tante, l’unico limite è la tua immaginazione, ma per fortuna ci sono io a darti qualche consiglio!

 

Conclusione

Siamo arrivati alla fine. Ora hai scoperto cos’è un tema child wordpress e come funziona. E’ sicuramente utile quando sei agli inizi e vuoi fare pratica evitando di andare a rovinare la struttura del sito premium per cui hai speso tanti soldini. Tuttavia non pensare che anche i professionisti non usino il tema child. Anzi! Questo è il modo migliore per andare a modificare qualcosa che è stato creato da altri. Personalmente, se devo modificare un tema già esistente, creare un tema child è la prima cosa che faccio.

Fammi sapere cosa ne pensi nei commenti.

  • Ciao, sono Francesco Tonti

    Egogea di tonti francesco

    Sono un web developer, blogger e imprenditore digitale. Aiuto i miei clienti a migliorare la propria immagine aziendale per presentarsi al meglio nel mercato del lavoro.

  • Seguimi sui Social

  • Cerca nel Blog