Tema child in WordPress: Cos’è e come crearlo

tema child in wordpress cos'è e come crearlo

Oggi parleremo di un altro aspetto fondamentale per chi come me o come te che stai leggendo realizza siti web, “Cos’è e come creare un TemaChild” Creare un tema child su WordPress dovrebbe essere la prima cosa che dovresti fare appena che hai installato un tema all’interno del tuo sito web. Alberto ma cos’è un tema child? Un tema child (“bambino” o “figlio” in inglese) WordPress è un template che importa tutte le funzionalità e caratteristiche di un altro tema, chiamato parent theme (il tema “genitore”).
Un tema child ti permette di applicare modifiche al template utilizzato, sia grafiche che funzionali, senza correre il rischio di vederle “azzerate” al primo aggiornamento che rilascia la software house che lo ha sviluppato. Infatti, con il tema child attivato, ogni modifica effettuata riguarderà solo questo, mentre si manterranno inalterate le funzionalità e lo stile del tema “padre”. 

1. Perchè è importante utilizzare un Tema Child

Utilizzare un tema child come abbiamo detto in precedenza, è importante perchè andrai a lavorare su un tema figlio senza correre il rischio di perdere tutte le modifiche, appena aggiorni il tema. Ti faccio un esempio per capirci meglio, immagina di aver inserito nel footer di un sito, i tuoi riferimenti “Realizzato da tuonome/tuaazienda”, questa semplice modifica se non hai utilizzato un tema child, al primo aggiornamento perderai tutto, così facendo avrai perso tempo, e ne perderai altrettanto per riparare il “danno”. I migliori temi WordPress che ti ho citato nel precedente articolo, hanno a disposizione dentro il pacchetto che compri, sia il tema padre che il tema figlio, non per questo sono i migliori in assoluto ? 

2. Come creare un Tema Child

Creare un tema child senza plugin è davvero semplice è veloce, ma sopratutto non hai bisogno di avere grosse competenze lato codice.

1) Collegati via ftp al tuo sito web


2) Vai dentro la cartella Themes, questo è il percorso Wp-content –> Themes

3) Crea una cartella all’interno di Themes e chiamala “nometema-child” come da esempio sottostante

4) Crea un foglio di stile con l’editor che usi per scrivere codice, o semplicemente con un editor di testo, per il tema Child, chiamalo style.css e includi questo codice:

/*
 Theme Name: Il Mio Primo Child Theme
 Theme URI: http://sito-del-tema.com/
 Description: Descrizione del tuo child theme
 Author: Il tuo nome da sviluppatore
 Author URI: http://sito-autore.com
 Template: twentyseventeen
 Version: 1.0.0
 License: GNU General Public License v2 or later
 License URI: http://www.gnu.org/licenses/gpl-2.0.html
 Tags: light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
 Text Domain: twenty-seventeen-child
*/

Ovviamente andrai a sostituire le varie voci con quelle che ritieni più appropriate, ad esempio nome del tema, auto, template ecc…
NB: le uniche due voci necessarie per fare funzionare il child theme sono “Theme Name” e “Template“.

5) Carica via ftp style.css dentro la cartella nometema-child. Ti accorgerai subito caricando la pagina del tuo sito che non funziona, perche? perchè manca ancora un pezzetto ? 

6) All’interno del file style.css incolla questo codice @import url(“../twentyseventeen/style.css”); dopo il segno finale */
Questo codice veniva utilizzato per importare gli stili del tema parent all’interno del child.

7) Creiamo un nuovo file nella cartella del child theme e chiamiamolo “functions.php“, proprio come abbiamo fatto per style.css

8) Incolliamo questo codice 

<?php
function my_child_theme_enqueue_styles() {

 // Inserire l'handle usato dal tuo tema parent per registrare gli stili
 // al posto di 'parent-style'
 $parent_style = 'parent-style';

 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 ),
 wp_get_theme()->get('Version')
 );
}
add_action( 'wp_enqueue_scripts', 'my_child_theme_enqueue_styles' );

In tutto questo codice devi personalizzare una sola questa riga –> $parent_style = ‘parent-style’;
Al posto di “parent-style” devi inserire il nome utilizzato dal tuo tema parent per registrare il foglio di stile. Alberto dove trovo il nome utilizzato dal tema parent per registrare il foglio di stile? Niente paura! basta che vai dentro il file functions.php del tema parent e cercare la seguente funzione: wp_enqueue_style (di solito negli editor per cercare le stringhe di codice basta cliccare ctrl+f)

9) Infine aggiorna la pagina del tuo sito web e vedi se il tema carichi tutto correttamente

Conclusione

La guida su cos’è e come creare un tema Child, termina qui, se hai bisogno di delucidazioni, ti basta commentare qui sotto.
Ti chiedo un favore, se con questa guida ti ho fatto risparmiare tempo, e ti sono stato utile, mi farebbe molto piacere che tu condividessi il mio articolo su i tuoi social network ?

Condividi su