Capita spesso che gli utenti meno esperti vogliano cambiare determinati aspetti dei loro blog e vadano a farlo modificando direttamente i file (causando spesso dei guai e rendendo il blog inutilizzabile – e comunque editare i file implica che andranno rieditati ad ogni aggiornamento del tema, dunque è decisamente meglio evitare)!
Quindi spiegherò brevemente come modificare alcuni aspetti del blog tramite CSS utilizzando un comodo e semplice plugin (dunque nessun file verrà modificato e le modifiche applicate al template rimarranno anche dopo eventuali aggiornamenti).
Il plugin – da me sviluppato – lo potete scaricare qui:
< https://www.laltroweb.it/files/file/9-my-custom-css/? >
Oppure lo cercate e installate dal pannello amministrativo del vostro blog.
Appena installato dovete capire cosa volete modificare nel blog, e sarebbe bene usare un browser come Chrome o Firefox con gli strumenti per sviluppatore per andare a lavorare direttamente da live e fare tutte le prove utili).
Ad esempio, io uso firefox+firebug:
E grazie a questo posso andare direttamente a modificare “live” il my_style.css generato dal plugin per testare in anteprima le modifiche che andrò a fare:
riga 1: imposto un’immagine di sfondo al body
riga 2: elimino lo sfondo a “#page”
riga 3: imposto lo sfondo bianco a .site-inner (la parte centrale del blog).
In questo caso, come si può notare dal codice nello screen, sto provando a modificare lo sfondo del tema, affinché abbia un’immagine e non sia quel bianco assoluto che è di default nel tema “twentysixteen” (il tema predefinito nell’attuale versione di WordPress).
Ecco, queste tre righe di codice mi trasformano questo tema da così:
A così:
Se tutto è esattamente come desideriamo, non ci resta altro che copiare il codice dal live editor (è solo un live, basta aggiornare la pagina per perdere tutto) e salvarlo all’interno dell’editor del plugin (questo renderà le nostre modifiche permanenti e disponibili ai visitatori).
Ovviamente si tratta soltanto di un piccolo esempio del potenziale a disposizione!
Tramite css è infatti possibile modificare praticamente ogni aspetto grafico del sito (aggiungere elementi, nasconderli, cambiare colori, dare o rimuovere il grassetto, ecc).
Ad esempio, possiamo arrotondare gli angoli modificando così .site-inner (inserito nel precedente screen):
.site-inner { background:#fff none repeat scroll 0 0; border-radius:50px;}
Risultato (anche il footer sarà arrotondato):
Per dubbi o domande non esitate a chiedere.
Se avete bisogno di aiuto diretto create un topic nel forum e sarò lieto di aiutarvi 🙂