• Moderatore

    Qual è la differenza fra temi parent e temi child e quando si usa l'uno o l'altro

    Prima di spiegare la differenza faccio una precisazione, la traduzione di parent è genitore e non padre come spesso si vede in giro, quindi tradotto è tema genitore e tema figlio.
    La frase era "Luke i'm your father" 😂

    Se con i plugin posso averne tanti quanti me ne servono per il progetto con i temi al massimo posso averne 2 attivi "contemporaneamente" (poi vediamo perché ci sono le virgolette), un genitore e un figlio, il tema figlio non si può attivare se non è presente il suo tema genitore per cui è stato creato.

    Fin qui tutto semplice, ma perché esiste questo sistema?

    Il problema da risolvere era permettere agli sviluppatori di poter apportare modifiche al tema utilizzato senza il bisogno di mettere mano al tema stesso rischiando di perdere tutto al primo aggiornamento.

    Quando creare un tema child?

    Se per esempio la modifica è solo per il colore del testo, o altra opzione che già il tema genitore offre la possibilità di modificare grazie al customizer allora non conviene creare un tema child, per tutto le altre situazioni in cui sia necessario modificare il comportamento del tema genitore tramite sovrascrittura dei file allora è ok creare un tema child.

    Come si crea un child theme?

    Per creare un child theme servono solo 2 file, style.css e functions.php

    syle.css

    Il file style.css ci servirà principalmente per registrare il tema usando questo snippet:

    /**
     * Theme Name:   NomeDelMioTema
     * Template:     nome-del-tema-genitore-che-trovo-in-theme-name
     */
    

    È possibile anche aggiungere tutti gli altri campi disponibili per il tema genitore

    Possiamo decidere se mettere anche il nostro stile in questo file o metterlo altrove, per esempio io uso una struttura così: /assets/css/index.css, vedi come ti trovi meglio.

    Non siamo obbligati a caricare style.css, possiamo caricare il file che usiamo nel nostro progetto se per esempio usiamo una struttura differente come faccio io.

    WordPress per sapere quali temi è possibile attivare fa una scansione della directory themes ad ogni load di pagina e cerca i file che hanno l'intestazione per dichiarare il tema, come nei plugin.

    Il metodo brutale prevede che si carichi sia lo stile del genitore che lo stile del figlio e poi fare un override delle regole, ecco, questo è un no-no, don't do this at home.

    Piuttosto prendi il css del genitore, lo metti nel figlio e carichi solo quello, se necessario fai un dequeue dello stile del genitore.

    Ma se il tema genitore cambia qualcosa nello stile?

    Può capitare e capisco possa essere un problema ma la regola è controllare i changelog e valutare se aggiungere il fix o meno.

    functions.php

    Il file functions.php invece serve per caricare la logica che vogliamo aggiungere, questo file verrà letto prima del functions.php del tema genitore.

    La regola principale per questo file è non usarlo per mettere tutto il codice php ed evitare lo spaghetti code ma invece usarlo come entry point, ovvero meglio strutturare tutto il nostro codice in modo da dividere i comportamenti in più file e poi fare un require di questi nel functions.php

    Esempio di struttura:

    | - src/
    | - src/add-subtitle.php
    | - src/remove-script.php
    | - functions.php

    <?php // file functions.php
    require('src/add-subtitle.php');
    require('src/remove-script.php');
    

    Attenzione però, visto che questo file verrà letto prima di quello all'interno del tema genitore non possiamo utilizzare funzioni dichiarate nel tema genitore stesso a meno di wrapparle dentro l'hook after_setup_theme o in caso ci sia data la possibilità per esempio con una funzione pluggabile o ci è consentito includere un file direttamente dal tema genitore utilizzando require_once.

    Cosa posso fare con un child theme?

    Con il child theme oltre fare le stesse cose che può fare qualsiasi tema si può sovrascrivere i file di template utilizzati nel tema genitore, per esempio se volessi modificare il file index.php del tema genitore semplicemente faccio un copia/incolla di questo file e lo metto nelle stessa posizione nella cartella del tema figlio, la stessa cosa la posso fare anche con i file inclusi usando le funzioni:

    get_header();
    get_sidebar();
    get_footer();
    get_template_parts();

    Qui tutte le altre; https://core.trac.wordpress.org/browser/trunk/src/wp-includes/general-template.php#L0

    Ho letto a proposito dei grand child theme, cosa sono?

    WordPress non permette di usare più di due temi contemporaneamente ma ci possono essere situazioni in cui sia necessario dover sovrascrivere il comportamento di un tema figlio (per esempio un tema non sviluppato da noi) e quindi avere avuto la possibilità di farlo con un tema nipote sarebbe stato utile, ma possiamo ovviare a questo problema creando un plugin dove andremo ad inserire i file necessari a modificare il comportamento dei temi attivi, questo sarà il nostro "tema nipote".

    Per ora basta così che ho messo già tanta carne al fuoco e per qualsiasi domanda chiedete pure 🙂

    #WordPressTheme #WordPressDevelopment