Vediamo adesso in questo nuovo articolo dedicato al WordPress come sia possibile aggiungere il proprio sito del codice CSS personalizzato indipendentemente dal fatto che si stia utilizzando un modello predefinito, un modello creato dall’utente o un modello scaricato. Per aggiungere CSS personalizzati, inizia aprendo WordPress con il tuo sito.
Potete raggiungere lo scopo semplicemente scaricando un template base di WordPress.
Per aggiungere il tuo CSS personalizzato, inizia aprendo il tuo sito WordPress a questo punto seleziona Aspetto e dopo seleziona il sottomenu Personalizza a sinistra . Metto la dizione di un blog in inglese ma è lo stesso in italiano
Figura 2 : i menu di WordPress per accedere all’area di personalizzazione CSS.
Vi ritroverete quindi in una figura simile alla seguente
Figura 3 : le opzioni Personalizza aspetto.
In questo caso ho utilizzato una distribuzione in inglese e quindi dovrete selezionare l’opzione “Additional CSS” . Scorrendo verso il basso potrete trovare lo spazio dove inserire il vostro CSS personalizzato
Figura 4 : Box per l’aggiunta di CSS personalizzati
Tale CSS si rifletterà immediatamente nel vostro Blog. Ovviamente per fare queste operazioni cancellate la cache oppure disattivatela proprio.
/* My custom CSS */
h1 {
color: #ff00ff;
}
P {
font-size: 36px;
color: orange;
}
h2
{
color: red;
font-color: 12px;
}
Figura 5 : aggiunta di CSS personalizzati e anteprima
Si noti che il CSS mostrato in Figura 5 è abbastanza minimale. Ossia le aggiunge sono molto minime infatti abbiamo modificato unicamente le dimensioni e i colori dei caratteri per H1, H2 e i tag p in modo da poter vedere quanto fosse facile apportare le modifiche.
Si noti che questi aggiornamenti verranno applicati al modello corrente. Se aggiorni il modello, c’è la possibilità che le tue aggiunte andranno perse. Pertanto, prima di aggiornare un modello, è necessario copiare il CSS aggiuntivo e quindi riapplicarlo dopo l’aggiornamento.
Un’alternativa all’utilizzo di questo metodo per l’aggiornamento del CSS per un sito sarebbe l’installazione di un plug-in per CSS personalizzati. Esistono numerosi plug-in CSS che possono essere utilizzati per questo. Questi includono:
- Semplice CSS e JS personalizzati
- WP Aggiungi CSS personalizzato
- Semplice CSS personalizzato
- CSS e JavaScript personalizzati
- Custom CSS Pro
- Css-js-php personalizzato
- CSS personalizzato modulare
- AccessPress CSS personalizzato
- E molti, molti altri …
Se scegli di utilizzare un plug-in, il tuo CSS personalizzato sarà comunque disponibile se aggiorni il tema o addirittura cambi il tema.