Inserire uno sfondo in una pagina wordpress

2

Se state cercando un modo per inserire uno sfondo in una pagina di wordpress, in questo articolo andremo a vedere in particolare, come con poche righe di CSS nel nostro foglio di stile, sarà possibile modificare ogni singola pagina del nostro blog wordpress con uno sfondo diverso, e tutto senza utilizzare plugin.

Di base, ogni tema wordpress ha la funzione nel pannello di personalizzazione di poter caricare uno sfondo unico per tutto il portale; ma se volessimo avere diverse immagini per ogni pagina in modo da renderla unica? Vediamo subito come fare.

Come cercare ID pagina wordpress

Come prima cosa dobbiamo scegliere degli sfondi e caricarli nella galleria media, oppure in un cartella desiderata via FTP, successivamente dovremo recuperare l’ID della pagina in cui vogliamo inserire il nostro sfondo.

Possiamo recuperarla velocemente navigando in  pagine > tutte le pagine e nella lista che apparirà dovremo passare il mouse sul nome della pagina desiderata senza cliccarci, e subito in basso a sinistra della nostra finestra browser verrà mostrato il link indicativo con il suo ID. (vedi immagine)

Come inserire uno sfondo differente in ogni pagina wordpress

Per utilizzare un’immagine di sfondo differente per tutte le pagine, abbiamo bisogno di metter mano al foglio di stile del tema, che è possibile raggiungere dal nostro pannello admin > Aspetto > Editor. O ancora meglio, quando si tratta di aggiungere o modificare il css di un tema, consiglio sempre di creare un child theme. Scopri come creare un child del tuo tema.

Codice per inserire uno sfondo in una pagina wordpress

Una volta trovato “style.css” andremo ad aggiungere il seguente codice:

body.page-id-100  {
background-image:url('http://www.maiuri.net/miosfondo.jpg');
background-repeat:no-repeat;
background-attachment:fixed;
}

Come potete vedere è semplicissimo, basterà sostituire il numero che indicia l’id della vostra pagina e l’indirizzo in cui risiede la vostra immagine caricata, e in questo modo potrete inserire uno sfondo per ogni singola pagina creata su wordpress.

Il codice può essere anche esteso a diverse pagine, tutte con lo stesso sfondo come nell’esempio seguente:

body.page-id-100,
body.page-id-200,
body.page-id-300  {
background-image:url('http://www.maiuri.net/miosfondo.jpg');
background-repeat:no-repeat;
background-attachment:fixed;
}

Inserire uno sfondo in una categoria:

.category-NomeCategoria {
background-image:url('http://www.maiuri.net/miosfondo.jpg');
background-repeat:no-repeat;
background-attachment:fixed;
}

Ora sapete come personalizzare gli sfondi in una pagina wordpress o categoria, Buon lavoro!


Choose your Reaction!
  • Il campo id proprio non compare da nessuna parte

    Rispondi
    • Salve Gfy, con le ultime versioni di wp la colonna id della pagina è stata tolta, ho però aggiornato l’articolo spiegando in che modo è possibile recuperarla. Saluti

      Rispondi
Lascia un commento

La tua email non verrà resa pubblica.

Membri attivi di recente
Foto del profilo di Andrea
Foto del profilo di Elisabetta
Foto del profilo di Luna
Foto del profilo di Stefano
Foto del profilo di Annalisa
Foto del profilo di Michela
Foto del profilo di Stregatto
Foto del profilo di favola
Foto del profilo di Crumina
Foto del profilo di batman
Foto del profilo di Theshadow88
Foto del profilo di Maiuri.net
Foto del profilo di Maiuri
Foto del profilo di Jennifer79
Foto del profilo di autore