Se avete installato un tema WordPress ma avete realizzato che non è proprio quello che fa per voi, potreste sentirvi frustrati. Eppure esistono un sacco di opzioni disponibili per personalizzare il tema WordPress.
La sfida è trovare il modo giusto per farlo.
In questo post, vi guiderò attraverso le opzioni per personalizzare il tema WordPress, vi aiuterò a decidere quale è quello giusto per voi e vi mostrerò come farlo in modo sicuro ed efficiente.
Preferite guardare la versione video?
Opzioni per Personalizzare un Tema
Prima di immergerci e iniziare ad apportare modifiche al vostro tema, vale la pena di capire quali sono le opzioni, in quanto si adattano a situazioni diverse.
Ecco una panoramica delle opzioni a vostra disposizione:
- Se desiderate aggiungere funzionalità al tema, installate un plugin.
- Utilizzate il Customizer nelle schermate di amministrazione di WordPress per personalizzare i font, i colori e magari anche il layout, a seconda del tema.
- Se state lavorando con il tema di un page builder, utilizzate le sue caratteristiche per personalizzare il design del vostro sito.
- Se avete installato un tema framework, usate uno dei temi child disponibili per personalizzare il sito, insieme a tutte le opzioni di personalizzazione disponibili nelle schermate di amministrazione.
- Se avete un tema creato ad hoc per il vostro sito e vi sentite a vostro agio a farlo, modificate direttamente il codice del tema.
- Se desiderate modificare il codice di un tema di terze parti, create un tema child.
Se volete modificare il codice, avete a disposizione diverse opzioni, dall’utilizzo dell’editor a blocchi, al Customizer, fino alla modifica dei file.
Li analizzeremo tutti in questo post, ma iniziamo con l’opzione più semplice: installare un plugin.
Avete Realmente Bisogno di Personalizzare il Vostro Tema?
A volte non è necessario personalizzare il tema: vi basta installare un plugin.
I temi dettano il design del vostro sito, l’aspetto e la visualizzazione dei contenuti (usate il nostro strumento di rilevazione del tema per identificare il tema che sta dietro un design che vi piace). I plugin aggiungono funzionalità extra.
Se le modifiche che vi piacerebbe apportare sono focalizzate sulla funzionalità piuttosto che sulla progettazione, considerate l’installazione di un plugin. Potrebbe trattarsi di un plugin da creare da zero, uno che si scarica dalla directory dei plugin o uno da acquistare.
Se volete modificare il file functions.php del vostro tema, chiedetevi:
Vorrei mantenere questa funzionalità se in futuro dovessi cambiare tema?
Se la risposta è sì, quel codice dovrebbe andare in un plugin, non nel vostro tema.
Buoni esempi dei casi in cui va preferito un plugin alla modifica del tema, sono l’aggiunta di widget, la creazione di custom post type e tassonomie, la creazione di campi personalizzati e l’aggiunta di funzionalità aggiuntive come un negozio o i miglioramenti alla SEO.
Personalizzazione del Tema WordPress Tramite le Schermate di Amministrazione
Se le modifiche che volete apportare sono incentrate sul design e relativamente semplici, potete farlo tramite le schermate di amministrazione. Il Customizer vi offre una varietà di opzioni per modificare il vostro tema: ciò avrete a disposizione dipenderà dal vostro tema. Vedrete per esempio la sezione Editor nel menu Appearance, da cui però vi consiglio di stare alla larga per i motivi che descriverò tra poco.
Personalizzazione del Tema Tramite il Customizer
Il modo più semplice per personalizzare il tema WordPress è utilizzare il Customizer.
Potete accedervi in uno dei due modi seguenti:
- Quando visualizzate il sito (e siete connessi), fate clic sul link Customize nella barra di amministrazione nella parte superiore dello schermo.
- Nelle schermate di amministrazione, fart clic su Appearance > Customize
Arriverete così sul Customizer.
Nella schermata qui sopra, ho installato un tema gratuito chiamato ColorMag che ha moltissime di opzioni di personalizzazione. Vi mette a disposizione altre sezioni del Customizer per le funzioni di progettazione che includono un’immagine di intestazione, i social media, i colori delle categorie e una scheda chiamata Design Options che vi permette di apportare modifiche al layout e al design del vostro sito.
A seconda del tema avrete diverse opzioni di personalizzazione, ma i temi più recenti sembrano aggiungerne sempre di nuove. Se trovate un tema che vi piace ma che non è proprio adatto a voi, potresti scoprire che personalizzandolo otterrete esattamente il design e il layout di cui avete bisogno.
Il Theme Editor (e Perché Non Usarlo)
Nelle schermate di amministrazione, avrete notato un’opzione chiamata Theme Editor, a cui si accede tramite Appearance > Theme Editor.
Questo vi dà accesso ai file del vostro tema, il che significa che potete modificarli direttamente.
Ma non fatelo.
Anche se vi sentite a vostro agio a scrivere CSS o PHP, modificare i file del vostro tema in questo modo è una pessima idea, per due motivi:
- Se avete acquistato o scaricato un tema di terze parti, qualsiasi modifica apportata andrà persa la prossima volta che aggiornerete il tema (che dovreste sempre mantenere aggiornato per motivi di sicurezza).
- Ancora più importante, se apportate una modifica che rompe il sito, questa non verrà tracciata e la versione precedente del file non verrà modificata. Potreste danneggiare irrevocabilmente il vostro sito.
Se volete modificare il codice nel vostro tema, dovreste farlo usando un editor di codice (scoprite i migliori editor HTML gratuiti), e non modificare i file nel vostro sito live fino a quando non l’avrete testato su un sito di staging. Se avete bisogno di modificare un tema di terze parti, dovreste farlo tramite un child theme. Vi darò più dettagli a questo proposito nel corso di questo post.
WordPress sa quanto sia pericoloso utilizzare il Theme Editori: vi avvisa anche quando provate ad accedervi.
Quindi seguite il consiglio di WordPress: non usate il Theme Editor!
Utilizzare Page Builder e Framework per Personalizzare il Tema di WordPress
Una gran parte dei temi di WordPress hanno opzioni di personalizzazione, il che significa che potete apportare modifiche al design e al layout tramite il Customizer.
Ma alcuni temi vanno oltre e sono progettati per essere ampliati e personalizzati in modo significativo. Questi temi sono chiamati temi framework.
Un’altra opzione è quella di utilizzare un plugin che consente di progettare il sito utilizzando un’interfaccia user-friendly: questi sono chiamati page builder.
Utilizzo di un Page Builder per Personalizzare il Vostro Tema
I plugin page builder sono progettati per rendere più facile l’impostazione del design del vostro sito, utilizzando un’interfaccia che vi permette di vedere subito il risultato delle modifiche.
Vi basta installare un plugin per il page builder con un tema compatibile e quindi utilizzare le opzioni che offre per progettare il sito secondo le vostre preferenze.
Uno dei page builder più noti è Elementor, ma esistono anche altre alternative, che trovate nella nostra guida ai page builder.
I page builder vi permettono di modificare i vostri post e le pagine con un’interfaccia drag-and-drop, il che significa che potete vedere subito come appariranno i vostri contenuti: potete disegnare ogni pagina in modo unico!
Qui sotto, sto usando il page builder di Elementor con il tema compatibile Hello Elementor.
I page builder vi offrono una grande flessibilità per quanto riguarda il layout e il design delle vostre pagine. Se siete abituati ad un builder per siti web come Wix, sarà ancora più facile effettuare la transizione a WordPress. E se preferite un’interfaccia WYSIWYG per i vostri contenuti WordPress, questi possono aiutarvi a progettare rapidamente le vostro pagine.
Utilizzo di un Framework per Personalizzare il Vostro Tema
Un’alternativa ai page builder è rappresentata dai framework per temi. Si tratta di suite di temi pensati per lavorare insieme. C’è un tema principale che è il framework, e una scelta di temi child fra cui scegliere per personalizzare il tema principale e farlo apparire nel modo desiderato.
Un esempio di framework per temi è Divi, che include opzioni di personalizzazione per modificare ulteriormente il design del vostro tema child, e un’interfaccia drag and drop simile a quella dei page builder.
Lettura consigliata: Divi vs Elementor: Confronto tra i Plugin WordPress per Page Builder
Modificare il Codice del Vostro Tema WordPress
Se vi sentite a vostro agio con CSS e/o PHP, allora potete modificare il codice del vostro tema per personalizzarlo.
In questo modo otterrete il massimo grado di controllo.
Se volete modificando il vostro tema che è stato sviluppato appositamente per il vostro sito, allora potete modificarlo direttamente. Ma se state lavorando con un tema di terze parti e volete modificarlo, dovreste sempre creare un tema child per evitare di perdere le modifiche la prossima volta che lo aggiornate.
Modifica dei File del Tema
Il primo passo per modificare il tema WordPress è capire quali file controllano cosa, e quali di questi è necessario modificare.
Il Foglio di Stile
Ogni tema WordPress ha un foglio di stile, chiamato style.css. Contiene tutto il codice per lo styling del vostro sito: layout, font, colori e altro ancora.
Se desiderate modificare i colori del tema, ad esempio, potete apportare modifiche al foglio di stile. Se volete aggiungere un nuovo font, dovreste usare il foglio di stile per applicarlo a diversi elementi come il corpo del testo e le intestazioni.
Prestate attenzione quando modificate il foglio di stile: specificità significa che il codice di un elemento non sempre proviene da dove pensate che provenga. Gli elementi erediteranno lo styling da altri elementi che si trovano sopra di loro nella gerarchia della pagina, a meno che non abbiate aggiunto uno styling specifico per l’elemento inferiore.
Per scoprire quale parte del codice CSS influisce su determinati elementi della pagina, potete usare l’ispettore del browser per leggere il CSS (ad esempio con il Chrome DevTools):
Potete quindi utilizzarlo per scrivere nuovo CSS per singoli elementi o per una serie di elementi o classi sulla pagina.
Se tutto questo parlare di elementi, classi e specificità è nuovo per voi, magari vorrete evitare di modificare direttamente il CSS del vostro tema, almeno finché non avrete imparato qualcosa di più sul CSS e su come funziona.
Il File delle Funzioni
Un altro file che praticamente ogni tema include è il file delle funzioni (functions.php). Questo è il file che fa funzionare un sacco di sezioni del vostro tema. Al suo interno, troverete il codice per registrare le caratteristiche specifiche del tema come le immagini in primo piano, widget, e altro ancora.
Se siete tentati di aggiungere del codice funzionale al tema, è qui che va fatto. Ma attenzione: nella maggior parte dei casi, sarebbe davvero meglio scrivere un plugin. Chiedetevi:
Vorrei mantenere questa funzionalità se in futuro dovessi cambiare tema?
Se la risposta è sì, scrivete un plugin invece di aggiungere codice al file functions.php. I plugin non devono essere grandi: niente vi impedisce di crearne uno con solo un paio di righe di codice.
Il file delle funzioni è tutto scritto in PHP, quindi è necessario avere familiarità con questo linguaggio. Non copiate ciecamente il codice che trovate tramite una ricerca su Google: prendetevi il tempo per capire cosa fa quel codice. Solo così potete star sicuro di star aggiungendo buon codice al vostro tema.
I File Template del Tema
La maggior parte dei file in un tema sono file relativi al template. Si tratta di file che determinano il contenuto che WordPress produce su una data pagina, e sono scelti in base alla gerarchia dei template.
Se volete cambiare il modo in cui il contenuto viene prodotto su un dato tipo di post, pagina o archivio, dovete modificare uno di questi file o crearne uno nuovo.
Per esempio, diciamo che il tema ha un file archive.php che viene utilizzato per produrre pagine di archivio per categorie e tag. Ora volete apportare modifiche al modo in cui i tag vengono prodotti. Create così un file chiamato “tag.php”, che sarebbe basato su archive.php e che include le vostre modifiche.
Ancora una volta, fate attenzione alla modifica dei file: potrebbero rompere il vostro sito. Fate sempre i vostri test su un’installazione locale usando uno strumento come DevKinsta e/o un sito di staging.
Qualunque sia il tipo di file da modificare, dovete farlo correttamente. Leggete la sezione sottostante sulle migliori pratiche per scoprire come modificare il vostro codice, non rompere il sito e non avere problemi di sicurezza.
Personalizzazione di un Tema di Terze Parti con un Tema Child
Se il tema che state usando sul vostro sito è stato sviluppato da terzi e volete modificarne il codice, dovete creare un tema child.
Questo perché se modificate direttamente il tema e poi lo aggiornate (cosa che dovreste fare), perderete tutte le modifiche apportate.
La creazione di un tema child consiste di quattro passi:
- Creare una nuova cartella in wp-content/temi.
- In quella cartella, create un foglio di stile. In quel foglio di stile, dite a WordPress che questo è un tema child del vostro tema esistente.
- Aggiungete al tema cihld copie dei file che desiderate modificare, e fate le modifiche lì.
- Attivate il tema child nel vostro sito.
WordPress utilizzerà sempre un file del tema child per produrre il contenuto, a meno che non esista un file più in alto nella gerarchia del tema parent. Se esistono due versioni dello stesso file, WordPress utilizzerà quella del tema child. Questo significa che il nuovo file nel tema child sovrascriverà quello del tema parent.
Le Migliori Pratiche per Personalizzare i Temi di WordPress
Ok, state pensando di personalizzare il vostro tema. Prima di procedere con le modifiche, seguite questi suggerimenti per assicurarvi di non danneggiare il vostro sito, renderlo vulnerabile agli attacchi o perdere il codice.
Se Possibile, Personalizzate Senza Modificare il Codice
Realizzare le vostre personalizzazioni tramite il Customizer o altrove nelle schermate di amministrazione, è più sicuro che modificare il codice: se potete, fate così.
Modificate il codice solo se avete familiarità con il linguaggio CSS (per il foglio di stile) e con il PHP (per altri file del tema) e sapete come farlo in modo sicuro.
Utilizzate un Sito di Sviluppo Locale per Apportare le Vostre Modifiche
Se state modificando il codice nel vostro tema o creando un tema child per apportare modifiche, dovreste fare il lavoro di sviluppo su un’installazione locale di WordPress che abbia il vostro tema installato e il contenuto copiato dal vostro sito live.
In questo modo, avete a disposizione una copia fedele del vostro sito live per testare i vari cambiamenti. Lavorare su un sito locale non avrà alcun impatto sul vostro sito live e può velocizzarvi il lavoro.
Anche se utilizza il Customizer, può essere utile affidarsi a una versione locale del sito per i test: così potete pubblicare le modifiche e testarle senza intaccare il sito live.
Una volta che avete testato le modifiche al vostro tema, potete caricarle sul sito live o, meglio ancora, potete testarlo su un sito di staging e poi pubblicarlo nel live.
Usate il Controllo delle Versioni
Quando apportate modifiche al tema, è necessario utilizzare il controllo della versione (version control) per tenere traccia delle modifiche.
Nel modo più semplice questo significa cambiare il numero di versione del tema e conservare copie di entrambe le versioni. Ma se fare il controllo di versione non è il vostro forte, dovete usare un servizio come GitHub per tenere traccia delle modifiche.
In questo modo, se un cambiamento causa problemi, potete facilmente tornare indietro senza dover apportare modifiche manuali.
Il controllo delle versioni è ancora più utile se lavorate come parte di una squadra, in quanto sarete in grado di vedere cosa stanno facendo gli altri membri. Per saperne di più, assicuratevi di leggere la nostra guida su git vs Github.
Utilizzare un Sito di Staging per Testare le Modifiche Apportate
Se avete accesso a un sito di staging (come lo staging gratuito di Kinsta che viene incluso in tutti i piani), testatelo prima di attivare la nuova versione del vostro tema (o il nuovo tema child) sul vostro sito live: è il modo più sicuro di procedere.
Questo perché ogni sito locale avrà alcune differenze rispetto al vostro sito live: si trova su un server diverso (uno creato sulla vostra macchina locale), può essere in esecuzione una versione diversa di PHP o uno qualsiasi degli altri strumenti che fanno funzionare il vostro sito.
Fate una copia del sito live sul vostro server di staging e poi caricate e attivate il vostro nuovo tema. Provate in lungo e in largo il vostro sito per essere sicuri che tutto funzioni: solo a quel punto potete spingere le modifiche al vostro sito live.
Rendete il Vostro Tema Responsive
Qualsiasi modifica che dovete apportare al vostro tema dovrebbe funzionare sia su mobile che su desktop.
Visto che sempre più persone accedono a Internet via smartphone, e che Googla si basa sull’indice mobile-first, ora più che mai è importante che il vostro tema funzioni sia su mobile che su desktop. Quindi, qualsiasi modifica apportata al tema deve essere mobile-friendly o preferibilmente mobile-first, se pertinente.
Questo si applica principalmente a qualsiasi modifica apportata al vostro stile o al layout: controllate che il nuovo layout funzioni su cellulare e che siano state aggiunte le query multimediali in modo che il layout si adatti alle diverse dimensioni dello schermo.
Se il tema non è responsive, questo avrà un impatto negativo sulle classifiche dei motori di ricerca e sui tassi di conversione.
Se non avete accesso a diversi dispositivi mobili su cui testare, potete usare uno strumento come BrowserStack per vedere come appare il vostro sito sui diversi dispositivi. Potete anche usare gli strumenti di sviluppo nel browser e le “responsive views” nel Customizer.
Assicuratevi Che le Vostre Modifiche Non Abbiano un Impatto Sull’Accessibilità
Eventuali modifiche al tema devono essere accessibili anche agli utenti con disabilità.
Non si tratta solo di garantire che il vostro sito funzioni sugli screen reader: vanno fatte anche altre considerazioni, come ad esempio quelle sugli schemi di colore e sulle dimensioni dei caratteri, che sono importanti per un gran numero di persone.
Se le modifiche che state apportando al vostro tema riguardano il rendere i colori più luminosi o il testo più piccolo, ripensateci: questo potrebbe rendere difficile per molte persone leggere o interagire con il vostro sito.
Prima di effettuare qualsiasi modifica sul sito live, utilizzate un verificatore di accessibilità per testare il vostro sito ed essere sicuri che sia accessibile per tutte le persone.
Rispettare gli Standard di Codifica WordPress
Se state modificando il codice del vostro tema o creando un tema child, dovete assicurarvi che il vostro codice sia in linea con gli standard di codifica di WordPress.
Questi standard esistono per garantire la coerenza e la qualità del codice e per evitare pasticci. Troverete standard per PHP, CSS e JavaScript, quindi prendetevi un po’ di tempo per controllare quelli che vi interessano e assicuratevi di seguirli.
Se il tema WordPress esistente è ben codificato e scrivete nuovo codice in modo coerente con quello già presente, siete sulla buona strada verso la conformità del codice. Assicuratevi di aggiungere commenti a qualsiasi modifica apportata al tema in modo che voi o altre persone che lo leggono, vi ricordiate cosa avete fatto quando ci ritornerete sopra in futuro. Ci si può illudere di avere una memoria di ferro, ma dopo qualche mese è davvero facile dimenticare il perché di una modifica a una linea di codice.
Riepilogo
Personalizzare il tema WordPress non è poi così difficile. A volte vi bastano semplicemente le opzioni del Customizer per apportare modifiche ai font, ai colori o alla tua favicon (assicuratevi di leggere la nostra guida approfondita sui font WordPress). Altre volte, è necessario creare un tema child per aggiungere un nuovo template di file a un tema.
Le opzioni che avete per personalizzare il tema includono l’utilizzo di un plugin o del Customizer, la modifica diretta del codice del tema WordPress o la creazione di un tema child.
Identificate l’opzione giusta per voi e personalizzate il tema a vostro piacimento e in modo sicuro, il tutto senza creare problemi al vostro sito.
Rachel McCollin aiuta le persone a creare siti web con WordPress dal 2010. È una grande fan di WordPress self-hosted e vuole aiutare quante più persone possibile a creare un sito web fantastico usandolo.
Lascia un commento