09/05/2008
Come modificare l’header del Blog
In questo tutorial mostriamo come modificare l’header del Blog.
Per chi non lo sapesse, l’header è la parte alta del Blog in cui sono presenti l’immagine e il titolo del Blog.

Per cominciare, con il tasto destro del mouse clicchiamo sull’immagine dell’header facendo apparire il menu a tendina. Cliccate su Salva sfondo come… (su Internet Explorer) o Visualizza immagine di sfondo (se utilizzate Firefox).

Avete già scelto l’immagine da sostituire? Bene.
Allora aprite l’immagine appena salvata con un programma di grafica.
Poi importate anche l’immagine da sostituire e adattate le sue dimensioni con quelle dell’immagine originale, in questo modo quando la inseriremo nel Blog sarà omogenea con il resto della grafica.
Salvate il file con la nuova immagine (vi consigliamo di salvarlo nel formato JPG o PNG) e caricatelo nel vostro Blog da Pannello di Controllo > Gestione File.
Cliccate sulla cartella images e poi sul bottone Sfoglia per selezionare e caricare la foto nel Blog.
Dopo pochi secondi vedrete la vostra immagine apparire nell’elenco dei file all’interno della cartella images.
Cliccate con il tasto destro del mouse sul nome del file e selezionate Copia collegamento (in Internet Explorer) o Copia indirizzo (in Firefox).

In questo modo avete copiato la url della vostra immagine. Incollatela in un file di testo e salvatela, ci servirà tra poco.
Ora dobbiamo inserire nel codice del Blog il link della nuova immagine che abbiamo caricato. Andate in Presentazione > Opzioni avanzate e cliccate su Modifica modello del Foglio di stile. Si aprirà una finestra popup contenente il codice CSS.
Cercate queste righe di codice:
#banner {
width:925px;
height:188px;
background: #4583D0 url('http://blog.alice.it/graphics/design/preview/set1/4583D0/banner.jpg') no-repeat;
color: #FFFFFF;
margin-left:auto;
margin-right:auto;
line-height: 140%;
}
La riga di codice che dovete modificare è una sola: background.
Copiate la URL dell’immagine che avete salvato poco fa e incollatela all’interno delle parentesi tonde. La riga di codice diventerà così:
background: #4583D0 url('http://nomeblog.myblog.it/lamianuovaimmagine.jpg’) no-repeat;
Cliccate su Salva queste informazioni e andate a vedere il vostro Blog.
L’immagine è cambiata!

Buon lavoro!
11:20 Scritto da: myblog.it in Blog - Tips and Tricks | Link permanente | Commenti (46) | Segnala
| Tag: myblog, virgilio, tutorial, header, blog, grafica, tip | OKNOtizie |
|
del.icio.us
|
|
Digg |
Facebook
