Personalizzare un sito WordPress
I CMS sono uno strumento che ha rivoluzionato l’approccio allo sviluppo per il web, agevolando esperti e non nella realizzazione di siti ad impatto e con contenuti facilmente modificabili. Molto spesso però, quello che ci viene offerto non ci basta: potremmo infatti avere la necessità di fare delle customizzazioni per dare quel pizzico di originalità al nostro sito o di dover presentare i nostri contenuti diversamente dall’impaginazione standard.
In questo percorso, prenderemo il CMS WordPress come riferimento per creare un sito completamente personalizzato che vi permetterà di distinguervi dal grande esubero in rete.
In particolare, andremo a capire:
- Come creare pagine personalizzate (page template)
- Mostrare categorie di articoli con più varianti
- Modificare la tipologia dei post (post type)
- Gestire le immagini
- Creare widget e posizionarli a proprio piacimento all’interno del sito
Conoscere la struttura
Prima di cominciare ad impastare il codice, è importante innanzitutto comprendere come è strutturato un tema di WordPress per sapersi poi muovere al meglio nella modifica dei file interessati.
Una volta installato, WordPress si scompatterà in diverse cartelle, ciascuna adibita ad uno scopo specifico. Poichè tutte le modifiche che andremo ad attuare saranno solamente modifiche a livello di template, tutti i file interessati si troveranno nella directory /wp-content/themes/nome_template_corrente/. Dei file presenti in questa cartella, i principali nella costruzione del template sono:
- index.php: visualizzazione di default
- header.php: la parte superiore del sito che precede i contenuti
- footer.php: la parte inferiore del sito, sottostante ai contenuti
- page.php: template delle pagine interne
- single.php: template per il singolo post
- archive.php: template per la presentazione di post di una categoria
- sidebar.php: la colonna laterale in cui generalmente compaiono i diversi moduli integrati
- functions.php: definisce le funzioni necessarie al buon funzionamento del sito
- style.css: foglio di stile principale
Installazione ed identificazione del template
Per poter iniziare a lavorare sul nostro template, va innanzitutto installato il tema da cui vorremmo partire: potremmo scegliere un tema che più si avvicina alle nostre esigenze o cominciare da un tema pulito come Twentytwelve.
L’installazione del template può essere effettuata in due modi:
- Caricare lo zip dal pannello di amministrazione in Aspetto → Temi → Installa Tema, cliccando sulla voce Upload.
- Importare la cartella del tema in /wp-content/themes.
Se l’operazione è andata a buon fine, vedremo comparire il nostro tema nel pannello di amministrazione all’interno del menu Temi.
È buona norma dare un nome personalizzato al tema scelto: rinominiamo quindi la cartella del tema in /wp-content/themes ed entriamo in style.css. Nel foglio di stile dovranno essere inserite le seguenti righe di codice:
/*
Theme Name: blog.artera.net
Theme URI: https://blog.artera.net
Description: Tema per il Blog di Artera
Author: Artera
Version: 0.1
Tags: artera, wordpress, magento, seo
*/
Ognuna di queste righe identifica, rispettivamente:
- Il nome del tema
- L’url di riferimento
- Una descrizione che lo renda unico
- L’autore
- La versione
- Eventuali tag che caratterizzano il tema
Andando ora in Aspetto → Temi, la descrizione del tema scelto dovrebbe ora essere cambiata con i parametri da voi inseriti. Per modificare l’immagine della miniatura del vostro template, non dobbiamo fare altro che sostituire il file immagine screenshot.png, presente nella cartella del template.
Fatte queste modifiche, tornate nel pannello di controllo e cliccate “Attiva” sul vostro tema: ora siete pronti per cominciare a sviluppare il vostro sito in WordPress!
Nel prossimo intervento, toccheremo con mano il codice relativo alle pagine, capendo cosa ci viene offerto e come modificarlo a nostro piacimento.
Grazie per le spiegazioni utilissime. Una precisazione di base: personalizzare un tema WordPress significa poter accedere ai suoi files sorgenti. Questo è possibile solo quando WP è installato sul TUO spazio web, in cui hai accesso e controllo totali. Se apri il sito usando lo spazio messo a disposizione da WP sui loro server, NON ti fanno accedere ai file sorgente .php, pertanto puoi modificare e customizzare ben poco, giusto?
Ciao Sandro, sì, se hai un blog su wordpress.com non hai la possibilità di mettere le mani sui file dei temi.
Per le principali differenze tra wordpress.com e la versione installabile su hosting di terze parti puoi leggere questo articolo: https://en.support.wordpress.com/com-vs-org/
Ciao,
Sono nuova su WP e avrei una domanda. Nonostante tutte le guide che ho letto mi risulta difficile capire come effettivamente personalizzare al 100% un sito. Ho chiara la differenza tra WordPress.com e WordPress.org ma una volta che sono su .org, che ho creato database e tutto come faccio effettivamente a cominciare a cambiare il layout come preferisco? ho anche applicato un tema con un layout da sito professionale, ma tuttavia il layout del mio sito rimane molto “bloggy” cosa che vorrei evitare. Hai qualche consiglio?
Grazie mille
Ciao Laura, quando installi un tema in WordPress hai 2 opzioni di personalizzazione:
1. personalizzare il tema tramite le opzioni disponibili nel pannello di amministrazione.
Ovviamente in questo caso sei limitata dalle opzioni messe a disposizione dal tema, ma il livello di difficoltà è relativamente basso, in quanto si tratta semplicemente di modifiche da interfaccia utente e senza scrittura di codice.
2. personalizzare il tema tramite la creazione di un tema figlio.
In questa situazione puoi operare solo se sei un programmatore e sai come scrivere codice in PHP, HTML e CSS, ma non hai limitazioni legate al tema, ma puoi sfruttare WordPress al 100%.