Struttura e organizzazione dei file in un tema WordPress

Rocco Vincy

Sebbene i temi WordPress richiedono essenzialmente due file, index.php e style.css, di solito sono costituiti da molti più files. Questo vuol dire che se non si fa attenzione a definire una struttura per posizionarli in modo efficiente all’interno di una o più cartelle, tutto il progetto può diventare rapidamente disorganizzato. In questo articolo vedremo insieme come organizzare al meglio i file di un tema WordPress in fase di sviluppo.

Come abbiamo già detto nei precedenti articoli, un tema WordPress ha una struttura modulare ed è composto da diversi Template Files. Di conseguenza, con un’efficiente organizzazione dei file all’interno di un tema WordPress è più facile intervenire per modificare, correggere o aggiornare ogni sua singola parte.

Organizzazione dei file in un tema WordPress

Nel momento in cui installi per la prima volta WordPress, installerai almeno un tema di default. Sicuramente, una volta autenticato nella Dashboard, se vai in aspetto -> temi troverai almeno uno dei temi Twenty.

I temi Twenty sono temi realizzati dal team di WordPress e sono ottimi esempi da prendere in considerazione per iniziare a svilupparne uno zero.

Il nome assegnato a questi temi fa riferimento all’anno di realizzazione, per esempio Twenty Seventeen si chiama così perché è stato sviluppato nel 2017, Twenty Nineteen nel 2019 e Twenty Twenty nel 2020.

Ma vediamo in che modo sono organizzati in file all’interno di uno di questi temi.

Se prendiamo come esempio il tema Twenty Twenty, noteremo all’interno della sua directory i file organizzati in questo modo:

assets (dir)
      - css (dir)
      - fonts (dir)
      - images (dir)
      - js (dir)
classes (dir)
inc (dir)
template-parts (dir)
templates (dir)
404.php
comments.php
footer.php
functions.php
header.php
index.php
package.json
package-lock.json
print.css
searchform.php
singular.php
style.css
style-rtl.css

Come puoi vedere, analizzando l’organizzazione dei file all’interno della directory del tema, i Template Files principali sono posizionati nella directory root, i file css, javascript e le immagini sono posizionati nella cartella assets, i Template Files Parziali nella directory template-part e i file che contengono le funzioni principali da includere nel file function.php sono posizionati nella cartella inc.

Sebbene WordPress non richieda la presenza di cartelle predefinite, è buona norma usare una struttura ordinata in questo modo.

Ad ogni modo, è bene fare alcune precisazioni sull’organizzazione dei file in un tema WordPress.

Innanzitutto, come avrai sicuramente notato dalla struttura del tema analizzato, il file style.css oltre ad essere un file obbligatorio, è anche l’unico foglio di stile che dev’essere posizionato obbligatoriamente all’interno della directory root.

Inoltre da WordPress 3.0 i temi che non contengono header.php e footer.php, o alternative simili, sono deprecati. Quindi il tema che vorrai realizzare dovrà contenere anche questi due file.

Per concludere, un piccolo consiglio che ti voglio dare è quello di preparare sempre il tuo ambiente di lavoro predisponendo subito le opportune sottodirectory prima di iniziare a sviluppare un tema.

Naturalmente nessuno ti vieta di integrare e modificare la struttura di un tema che hai creato in un secondo momento. L’importante è che tieni sempre in ordine i tuoi file, in modo da poter eseguire eventuali correzioni o aggiunte in modo facile e veloce.

Conclusioni

Per ora ci fermiamo qui. Nei prossimi articoli vedremo perché è così importante il file style.css e qual è il suo compito altre a quello di definire lo style del sito. Inoltre, inizieremo a scrivere un po’ di codice ed impareremo ad usare i Template Tags e il Loop di WordPress.

Nel frattempo, se vuoi farmi qualche domanda, chiedere informazioni o darmi qualche consiglio, puoi farlo scrivendoci sulla nostra pagina Facebook o via email.

Prossimo articolo -> A cosa serve style.css e come installare un tema in WordPress

Cosa sono i Post Type di WordPress <- Articolo precedente