Creare un child theme per WordPress

I child theme di WordPress (tema figlio) sono temi grafici ricavati dal tema principale (tema genitore). Qual è la particolarità o il beneficio di creare un child theme? È molto semplice: creando un sottotema potrete personalizzare (a livello di codice e di stile) il vostro blog o sito, non intaccando il tema principale: non modificherete infatti una sola riga di codice.

Questo significa che potrete intervenire sulle singole porzioni di pagina e sui file desiderati senza rischi: un indubbio vantaggio che libera il designer anche da eventuali errori di codifica in cui potrebbe incappare.

Come creare un child theme

[PASSO 1] –  Accedere allo spazio web ove è ospitata la cartella contenente il tema principale, di solito raggiungibile tramite questo percorso: rootsito/wp-content/themes/.

[PASSO 2] – All’interno di /wp-content/themes/ creare una nuova cartella con un nome a piacere (da dare al tema): questa cartella conterrà i file del child theme.

[PASSO 3] – La prima operazione è creare un file .CSS all’interno della cartella stessa: il file dovrà chiamarsi style.css, obbligatoriamente.

Per praticità ne creiamo uno nuovo, in modo da avere il pieno controllo sulla scrittura del markup inerente al foglio di stile. Creiamo una struttura simile con le informazioni di intestazione commentate racchiuse tra gli slash [/] e gli asterischi e poniamola sopra di tutto:

/*Theme Name: Paolo Child Theme
Theme URI:      http: //example.com/
Description:    child theme creato da Paolo
Author:         Paolo De Feo
Author URI:     http: //example.com/about/
Template:       nome directory del tema genitore
Version:        0.0.0
*/
@import url("../rootsitoweb/nomestile.css");

Le informazioni “Theme Name” e “Template” debbono essere inserite obbligatoriamente. La riga “Template” è la più importante e non dovete assolutamente dimenticare di ometterla facendo attenzione a scrivere correttamente: WordPress è case-sensitive e riconosce tra maiuscole e minuscole.

Senza la riga “Template” WordPress non sarà in grado di riconoscere l’appartenenza del tema figlio e tutto il lavoro verrà vanificato.

Ora bisogna aggiungere le regole CSS: all’interno del foglio di stile principale richiamiamo il o i vari fogli di stile tramite l’istruzione @import url.

Tramite questa istruzione potrete richiamare il  file CSS principale del tema genitore o i vari fogli di stile creati ad-hoc per personalizzazioni specifiche.

IMPORTANTE: l’istruzione  @import url deve precedere necessariamente tutte le regole di stile, così come illustrato nel codice di esempio.

Per attivare il tema figlio basterà selezionarlo tra i temi disponibili.