Come formattare un immagine di sfondo per Blogger

September 11

Come formattare un immagine di sfondo per Blogger


Un layout unico o stile può fare un blog distinguersi dalla concorrenza. Molti siti di blog, come Blogger di Google, offrono agli utenti la possibilità di personalizzare i propri blog utilizzando componenti predefiniti. Sfondi, per esempio, possono visualizzare diversi colori o del tutto assenti. Se sai come accedere modello di progettazione del tuo blog, non è possibile utilizzare solo le immagini per lo sfondo, ma loro formato. Ciò consente di personalizzare le caratteristiche visive del tuo blog per il contenuto di condividere con il mondo.

istruzione

1 Accedere tuo account Blogger, e clicca sul link "Dashboard" nella parte superiore della pagina. In questa pagina vengono visualizzati i blog attuali.

2 Fare clic sul collegamento "Design" accanto ad uno dei blog. Viene visualizzata la pagina "Add e Disporre Elementi pagina". Fare clic sul link "Modifica HTML" nella parte superiore della pagina. Una casella di modifica visualizzata nella parte inferiore della pagina. Questa casella visualizza il codice HTML del tuo blog.

3 Individuare la sezione "Backup / Restore Template" nella parte superiore della pagina. Questa sezione consente di eseguire il backup del codice HTML corrente in una cartella sul disco rigido. Backup del codice in modo da garantirvi avere una copia del documento originale, nel caso in cui è necessario ripristinarlo.

4 Fai clic su "Scarica modello completo", quindi fare clic su "Salva file". Fai clic su "OK" per salvare il backup sul disco rigido.

5 Scorrere il codice HTML nella casella di modifica nella parte inferiore della pagina. Cercare il blocco di codice seguente:

Blocco: body {

di carattere: $ (body.font);

colore: $ (body.text.color);

background: $ (body.background);

}

Questo codice imposta le caratteristiche di visualizzazione di sfondo del tuo blog. Poiché si tratta di codice HTML ordinario, si può cambiare proprio come si farebbe il codice su qualsiasi altro documento HTML.

6 Eliminare quel blocco di codice, e sostituirlo con il seguente:

body {

background-image: URL ( 'http://www.mySite.com/myImage.jpg');

background-attachment: scroll;

background-repeat: no-repeat;

}

Sostituire "http://www.mySite.com/myImage.jpg" con l'URL di un'immagine reale su Internet o sul server Web.

7 Fai clic su "Anteprima" per visualizzare in anteprima le modifiche. Il tuo post verrà visualizzato in una nuova finestra o scheda. Il post visualizza l'immagine di sfondo specificata nel codice HTML. Scorrere verso l'alto e in basso nella pagina. L'immagine di sfondo si muove con la pagina perché si imposta il valore della proprietà background-attachment a "scorrimento".

8 Tornare alla casella di editing HTML, e individuare il codice di blocco è stato aggiunto. Eliminare questa riga:

background-attachment: scroll;

Aggiungere la seguente riga al suo posto:

background-attachment: fisso

Fai clic su "Anteprima", e scorrere verso l'alto e in basso nella pagina di nuovo. Lo sfondo rimane fisso perché si imposta il valore dell'attributo background-attachment al "fisso" invece di "scorrimento".

9 Fai clic su "Salva modello" per salvare le modifiche.

Consigli e avvertenze

  • Se si sceglie una immagine di sfondo che è più piccola della finestra del browser, è possibile applicare ulteriormente la formattazione da piastrelle l'immagine di sfondo. Do che cambiando la parola "no-repeat" per "ripetere" nell'ultima riga del codice di blocco è stato aggiunto. I browser verrà affiancata l'immagine in orizzontale e in verticale.