Il Child Theme in WordPress (tema figlio)

Un Child Theme (che tradotto in italiano significa tema figlio) è un tema con il quale si ereditano le funzionalità di un Tema Padre o Tema Principale (Parent Theme), in pratica si ereditano le funzionalità di un altro tema.

Attraverso l’utilizzo di un Child Theme siamo in grado cambiare la grafica e lo stile del Parent Theme, cioè il tema usato per personalizzare il layout del sito creato con WordPress, senza però modificare il codice originale proprio del Parent Theme. Quando poi quest’ultimo verrà aggiornato, le modifiche effettuate non verranno perse. Quando effettuiamo l’aggiornamento di un tema infatti si verifica la sovrascrittura di tutti i file che lo compongono e il conseguente annullamento di tutte le personalizzazioni ed è per questo motivo che i Child Theme sono la migliore soluzione per quanto riguarda apportare modifiche a un tema di WordPress.

Vediamo insieme quale procedimento seguire con il fine di creare un Child Theme.

1) Creaiamo la directory del Child Theme

Decidiamo un Parent Theme, il quale potrebbe essere un tema qualsiasi a nostra scelta herunterladen. Io per esempio prendo in esame il tema Twenty Fourteen, ovvero uno dei temi che WordPress offre come default quando lo installiamo.
A questo punto dobbiamo creare sullo spazio web una directory in cui inseriremo il Child Theme, infatti essendo un tema vero e proprio necessita di una propria directory, diversa da quella del Parent Theme.

Andiamo quindi nella directory dove sono presenti i temi di WordPress ovvero …/wp-content/themes e tramite un qualsiasi software FTP, ad esempio FileZilla che è molto semplice da usare o anche una qualsiasi altra applicazione che consenta la gestione dei file, creiamo una nuova cartella e chiamiamola con il nome del Parent Theme e attaccato Child (per intenderci nel nostro caso sarà twentyfourteen-child).

2) Creiamo il file style.css

All’interno della cartella che abbiamo fatto per contenere il Child Theme(twentyfourteen-child) creiamo un nuovo file chiamandolo style.css, ovvero l’unico file necessario a un Child Theme. Questo si occupa di fornire le informazioni necessarie a WordPress per riconoscere il tema figlio e sostituisce il file style.css del tema genitore sovrascrivendolo dropbox download individual images. Sono presenti anche altri file in un tema WordPress ma si possono considerare opzionali.

Ora apriamo il file style.css e non dovremo fare altro che inserire queste infomazioni:

/*
Theme Name: Twenty Fourteen Child
Description: Child Theme di Twenty Fourteen
Author: Simone Amidei
Author URI: http://www.wordpress.cx/
Template: twentyfourteen
Version: 1.0
*/

@import url(“../twentyfourteen/style.css”);

Cosa significano però le singole voci presenti nel file style.css? Provo a spiegarlo in modo semplice:

– /*                           Questa riga spiega a WordPress che inizia l’intestazione, ovvero indica la sua apertura (l’header) e questa riga è obbligatoria.

– Theme Name:      In questa riga andremo a scrivere il nome che vogliamo dare al Child Theme e anche questa voce è obbligatoria.

– Description:         Serve per fornire una descrizione del tema Child Theme. Questa voce è opzionale.

– Author:                  Si indica il nome dell’autore del Child Theme tvnow serien herunterladen. Anche questa voce è opzionale.

– Author URI:         URL del sito dell’autore (la pagina web). Come le precedenti anche questa voce è opzionale.

– Template:             Si scrive il nome della directory che contenente il tema padre o Parent Theme e indica a WordPress quale tema vogliamo venga usato come padre. Dovendo noi utilizzare il tema Twenty Fourteen, situato nella cartella ../wp-content/themes/twentyfourteen, scriveremo twentyfourteen (per quanto riguarda il nome della directory viene fatta la distinzione tra lettere maiuscole e minuscole). Questa voce è obbligatoria.

– Version:                Indica la versione del Child Theme. Io ho inserito 1.0 ma si poteva inserire tranquillamente anche 0.1 e così via dvdvideosoft free studio free download old version. Questa voce è opzionale.

– */                              Questa riga spiega a WordPress che tetmina l’intestazione, ovvero indica la sua chiusura (l’header). Questa riga invece è obbligatoria.

– @import url (“../twentyfourteen/style.css”);

Con quest’ultima riga indichiamo al Child Theme di caricare il file style.css del Parent Theme (ovvero twenty fourteen) attraverso il percorso che abbiamo scritto tra le parentesi tonde.

Prima di @import non si devono inserire altre regole CSS infatti è importante che questa riga sia scritta subito dopo il codice della testata e prima delle altre regole CSS.

Ultimo accorgimento: i due punti prima della barra (../) non devono venire sostituiti con il percorso completo. Infine le virgolette doppie (“) non devono essere frutto di un copia/incolla, bisogna digitare il percorso a mano, attraverso l’uso della tastiera microsoft visio testversion kostenlos.

3) Attivare il Child Theme

Adesso finalmente possiamo attivare il Child Theme.

Per prima cosa accediamo alla bacheca di WordPress  >  Andiamo nella sezione Temi all’interno della voce Aspetto e se il file style.css che abbiamo compilato è stato scritto nel modo corretto vedremo che tra i Temi disponibili sarà presente anche il Child Theme. Nel nostro esempio sarà il Twenty Fourteen Child (perchè questo è il nome che gli abbiamo dato nella voce Theme Name, nel file style.css che abbiamo compilato prima).

Ora possiamo cliccare “Attiva” per attivare il tema Twenty Fourteen Child.

Nel caso in cui volessimo aggiungere un anteprima del Child Theme dovremmo creare un file immagine che ne rappresenti proprio l’anteprima, per esempio attraverso programmi che eseguono uno screenshot dello schermo (salva lo schermo come immagine), chiamarla screenshot.png e posizionarla nella directory del Child Theme. Altrimenti possiamo copiare e incollare il file screenshot.png del Parent Theme.

Il layout del Child Theme che abbiamo appena attivato non sarà altro che una copia esatta del layout del Parent Theme (nel nostro caso il tema Twenty Fourteen) apps horizon box. Il motivo sta nel fatto che nel file style.css del tema Twenty Fourteen Child ci siamo limitati a inserire solamente le informazioni che servono a WordPress per riconoscere il Child Theme.

4) Personalizzare il Child Theme

Innanzi tutto accediamo alla bacheca di WordPress  >  Andiamo nella sezione Editor all’interno della voce Aspetto.

Alla voce “Selezionare il tema da modificare” all’interno della finestra “Modifica temi” scegliamo il Child Theme (nel nostro esempio Twenty Fourteen Child) e facciamo clic su “Seleziona”.

Nella parte destra della pagina in fondo, sotto Stili, sarà presente soltanto un file: il file style.css che abbiamo creato prima (foglio di stile) musik mp3 downloaden kostenlos.

Tutte le personalizzazione del Child Theme dovranno essere inserite subito dopo la regola @import url. Nel caso in cui inserissimo una qualsiasi regola prima, questa sarà invalidata e il file style.css del Parent Theme non verrà importato.

Con il fine di avere il controllo sulla personalizzazione del tema è importante cominciare a familiarizzare un pò con i linguaggi di programmazione CSS, HTML e PHP. Saper usare HTML e CSS comporterebbe infatti una maggiore libertà da parte tua di testare varie grafiche e stili per il tuo sito. Per questo suggerisco di seguire video-guide online gratuite semplici ma che sono in grado di aiutarti.

Prova ad andare sulla pagina che ti indicherò tra poco e vedrai che sarenno presenti una decina di guide per utilizzare il linguaggio CSS (Clicca qui) tutte gratuite herunterladen.

Se per esempio volessimo cambiare il colore del Titolo del sito visualizzato sul nostro tema lasciando invariato tutto il resto dovremmo usare una regola che si dovrebbe scrivere subito dopo la riga “@import url (“../twentyfourteen/style.css”);”, la quale sarebbe:

#site-title a {
color: #……..;
}

Al posto dei punti ci vorrebbe il codice del colore con cui vogliamo sia visto il Titolo.

Dopo aver inserito queste stringhe non dovrete fare altro che cliccare su “Aggiorna file” e visualizziamo il sito per vedere la modifica.

5)Come funziona il Child Theme

Qualsiasi regola scritta nel file style.css del Child Theme viene utilizzata per sostituire le stesse regola presente nel file style.css del Parent Theme quindi se nel file style.css del Child Theme non fosse contenuta nessuna regola, WordPress utilizzerebbe le regole presenti nel file style.css del Parent Theme.

Questa operazione viene effettuata anche in tutti gli altri file di un tema WordPress, cioè header.php, index.php, footer.php, ecc…

Se volessimo modificare il file header.php dovremmo creare un file header.php nella directory del Child Theme per poi personalizzarlo Download candy crush saga for free. Come nel caso del file style.css anche in questo caso le regole scritte nel header.php del Child Theme andranno a sostituire quelle del header.php del Parent Theme. Nel caso in cui nella directory del Child Theme non fosse presente il file header.php, WordPress ovviamente utilizzerà il file header.php del Parent Theme. All’interno del Child Theme possiamo inoltre includere file non presenti nel Parent Theme.

L’unica eccezione riguarda il file functions.php che non bisogna confondere con il file di WordPress situato nella cartella wp-includes.

Infatti il file functions.php del Child Theme non viene sostituito ma viene caricato come aggiunta del file functions.php del Parent Theme, quindi viene caricato prima il file functions.php del Child Theme e subito dopo quello del Parent Theme englisch hörbücher kostenlos downloaden.

Questo ci permette di aggiungere delle funzioni che, nel caso in cui il Parent Theme venisse aggiornato, non verrebbero eliminate ma rimarrebbero salvate all’interno del file functions.php del Child Theme.