Come creare un Child Theme per WordPress

Quante volte vi è capitato di chiedere aiuto su un gruppo di Facebook sul come modificare il footer del vostro tema e vi hanno risposto “mi raccomando fai le modifiche sul child”?
Ma cos’è questo tanto nominato Theme Child? Volendo usare la definizione del Codex, la bibbia di wp:

“un Child Theme 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”

Quando dobbiamo usare un child theme WordPress?

  • Quando vogliamo apportare modifiche al design del tema
  • Quando vogliamo modificare un tema di terze parti (es. tema acquistato su Themeforest)
  • Quando vogliamo modificare dei file senza preoccuparci di futuri aggiornamenti del tema
  • Quando vogliamo aggiungere funzioni al nostro tema padre

Come Creare un tema Child di WordPress

Creare un theme child è decisamente molto semplice e veloce ma soprattutto vi bastano soltanto due file, functions.php e foglio di stile (style.css).

Css Style Child Theme

Una volta creata la cartella del nostro child (nometema-child) aggiungete all’interno un foglio stile questa intestazione commentata ma necessaria, però, a dare delle informazioni  a WordPress per riconoscere il child theme.

Mi raccomando la riga Template deve essere inserita e compilata correttamente altrimenti il child non funzionerà.

/*
 Theme Name:   UnderStrap Child
 Theme URI:    https://www.understrap.com
 Description:  UnderStrap Child Theme
 Author:       Holger Koenemann
 Author URI:   http://www.holgerkoenemann.de
 Template:     understrap
 Version:      0.5.3
 License: GNU General Public License v2 or later
 License URI: http://www.gnu.org/licenses/gpl-2.0.html
 Text Domain:  understrap-child
 GitHub Theme URI: holger1411/understrap-child
*/

Ma che informazioni abbiamo inserito all’inizio del nostro style.css?

  • Theme Name: il nome del tema.
  • Theme URI: documentazione del tema
  • Description: una breve descrizione del nostro tema
  • Author: autore del tema
  • Author URI: il sito web dell’autore del tema
  • Template: nome della cartella in cui è troviamo il tema padre, è fondamentale ai fini del funzionamento del nostro child
  • Version: versione del tema
  • License: la licenza GNU
  • License URI: il link alle informazioni sulla licenza

Una volta salvato il tema nel menu aspetto / temi del nostro pannello di backend troveremo il nostro nuovo tema.

Functions.php Child Theme

Una volta creato il foglio di stile passiamo ora all’ultimo file necessario al corretto funzionamento del nostro child. Senza questo file infatti il tema non avrà connesso nessun css e la pagina risulterà come semplice html.

Create il vostro file functions.php e copiate e incollate quanto segue:

<?php
/* enqueue script for parent theme stylesheeet */        
function theme_enqueue_styles() {
 // enqueue style
 wp_enqueue_style( 'parent', get_template_directory_uri().'/style.css' );                       
}
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles');

Ma a cosa servono questi parametri? Wp_enqueue_styles ci servirà per agganciare il foglio di stile al tema principale e get_template_directory_uri invece per individuare il percorso del nostro file (es. nomesito.it/wp-content/themes/nome-child/style.css).

Come si attiva il WordPress child theme?

Una volta che abbiamo in nostri due file non ci resta che andare nel menu Aspetto / Temi e attivare il nostro child come fosse un normalissimo tema. Una volta switchato il tema non noterete nessuna differenza, WordPress infatti continuerà ad utilizzare i file del tema principale a meno che non li aggiungiate al vostro child per modificarli.

Come modificare il footer su WordPress nel modo corretto

Dopo essere arrivati fin qui possiamo rispondere alla domanda iniziale dell’articolo e capire il corretto modo di modificare il file footer.php. Supponiamo che il nostro tema abbia il footer strutturato su una colonna e noi ne volessimo quattro, qual è la procedura giusta da seguire?
Andate nel vostro tema padre e copiate il file footer originale. Fatto?
Ora prendete il file e copiatelo nel vostro child theme. Fatto?
Aprite il file e modificatelo a vostro piacimento e trasformate quel col-md-12 in 4 col-md-3 ed ecco fatto, avete il vostro footer custom senza aver intaccato il tema.

E voi trovate questa funzione di WordPress utile per i vostri progetti? La usate spesso o modificate direttamente i file del vostro tema?

 

Iscriviti alla newsletter

Ricevi contentuti esclusivi e news sulla SEO

Contattaci