Tema child per WordPress – Come crearlo in 5 minuti

Tema child per WordPress – Come crearlo in 5 minuti

WordPress è un ottimo strumento pe creare siti internet, ha moltissimi temi già pronti e molti plug-in che aggiungono funzionalità extra. Esistono nel repository ufficiale di WordPress.org qualcosa come 7916 temi (ad oggi) e 57918 plug-in. Creare un tema child per WordPress ci aiuta a non dover cambiare tema per aggiungere quella particolare funzionalità che cerchiamo e  a non dover caricare un ennesimo plug-in.

Modificare il tema da solo non serve. Tutti i temi, o per meglio dire, tutti i  migliori temi che possiamo trovare sul repository (che sono sempre gratuiti) ogni tanto vengono aggiornati. Questo vuol dire che tutti i file che compongono il tema vengono sostituiti in automatico. Questi aggiornamenti servono per molte cose: Migliorare le prestazioni, eliminare dei bug, rendere compatibile il tema con le nuove versioni di wordpress, ecc. E nel caso di una modifica al tema il file che siamo andati a modificare verrebbe sovrascritto, facendoci perdere quelle modifiche che abbiamo fatto.

Ecco che ci viene in soccorso il tema child per WordPress

Il tema child per WordPress non è altro che un tema copia del tema genitore, che ci permette di modificare  i file al suo interno senza che questi vengano sovrascritti al momento dell’aggiornamento.

Come creare la cartella del tema child per WordPress e file CSS

Prendiamo come esempio il tema OceanWp, uno dei temi più scaricati di WordPress.

La prima cosa da fare è creare la cartella del tema child.

  1. Accedi alla cartella dove è contenuto il tuo sito costruito con WordPress. Puoi utilizzare due metodi:
    a) Attraverso il File Manager del tuo hosting
    b) Via FTP.
  2. Entra nella cartella wp-content e poi all’interno della cartella themes. In questa cartella ci sono i temi installati sul tuo sito.
  3. Crea una nuova cartella e chiamala come ti piace (per esempio tapulli).

Bene, ora abbiamo la cartella, dobbiamo creare al suo interno il file CSS.

Come creare il file CSS.

  • Con block notes di windows crea un nuovo documento di testo (*txt)
  • Rinominalo style.css. Dovrai modificare quindi anche l’estensione del file, da .txt a .css.
  • Apri il file utilizzando un qualsiasi editor di testo e incolla al suo interno questo codice:
    /*
    Theme Name: Tapulli
    Theme URI:(link al tuo sito)
    Description: Tema Child per il tema OceanWp
    Author: Il tuo nome
    Author URI: (link al tuo profilo) 
    Template: oceanwp
    Version: 1.0.0
    */
  • Modifica il codice sostituendolo con i dati del tema che stai usando tu.
  • Carica questo file all’interno della cartella wp-content/themes/tapulli

Le sole cose importanti e obbligatorie sono il nome del tema e il template. Le altre puoi anche non modificarle. Ma  danno un tocco di professionalità al lavoro. Se vuoi, nella cartella del tema, puoi anche aggiungere un’immagine personalizzata così che quando vai a scegliere il tema trovi subito quello desiderato e non una schermata grigia. Basta che crei un’immagine di 1200 per 900 px e la chiami screenshot.jpg. Ti comparirà una cosa simile

tema child per wordpress

Creazione del file functions.php

Ora che hai creato lo stile del tema child, devi fare in modo che esso erediti lo stile del tema parent.

Chi è già pratico di CSS potrebbe pensare che la via più semplice sia utilizzare il metodo @import, ma in realtà non è consigliabile. Infatti, questo sistema comporta un aumento dei tempi di caricamento della pagina e quindi un peggioramento delle performance del sito.

Segui invece questa procedura:

  1. Con la stessa procedura con cui hai creato lo style.css, crea un file di testo e rinominalo in functions.php.
  2. Apri il file con un editor di testo (block notes) e incolla questo codice:
    <?php
    add_action( 'wp_enqueue_scripts', 'enqueue_parent_theme_style' );
    function enqueue_parent_theme_style() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' );
    }
  3. Carica anche questo file all’interno della cartella wp-content/themes/tapulli

Diversamente dal CSS in questo non devi personalizzare nulla, copi il codice, lo incolli e basta.

Il tema child per WordPress è pronto, non devi fare altro che attivarlo dalla bacheca andando su Aspetto –> Personalizza –> Cambia.

Ora che hai il tuo bel tema child per WordPress puoi fare tutte le modifiche che vuoi, non solo al file functions.php, dove inserire funzioni particolari come questa, ma puoi andare a modificare tutti i file del tema, basta che li copi nella cartella, rispettando la gerarchia (ovvero, se un file è in una sottocartella del tema padre crei una cartella con lo stesso nome nel tema child e copi al suo interno il file che devi modificare).