Modificare posizione e grandezza header

Una delle cose che mi davano più fastidio nell'aprire un blog su blogger, oltre alla scelta conformista, è l'utilizzo di un cms (content management system) predefinito, con correlata limitazione di libertà gestionale.

Giusto per riferimento il tema che utilizzo è il minimal, a mio avviso il più modificabile e personalizzabile.
Una delle prime seccature in cui ci si imbatte è, dopo il cambio di interfaccia, la modificazione dell'header.


Ecco che una delle cose che paiono scontate come cambiarne la grandezza, sono immancabilmente state trascurate nelle possibilità di personalizzazione del blog.
In realtà il cambiamento manuale non necessita molta fatica, ma ne sarebbe costata molto di meno ai realizzatori di blogger fornire un opzione integrata nel servizio :(

Tutto quello che dovete fare per impostare un header con grandezza regolabile è spostarvi dalla pagina di gestione nella scheda Modello e Modifica HTML e immettere la seguente riga nella sezione Header:

background-image: url( indirizzo dell'immagine che volete utilizzare)

Per regolarne altezza e larghezza basta aggiungere le opzioni width e height:

width:720px;
height:183px;

L'immagine potrebbe risultare scentrata a seguito della modifica della larghezza. Per centrarla nuovamente inserite i parametri di posizionamento relativo top e right e modificateli a piacimento.

position: relative;
top: 0px;
right: 30px;

Infine per togliere il bordo predefinito basta azzerarne i pixel.
Per chiarire ecco come appare la sezione Header di questo sito:


/* Header
-----------------------------------------------
*/

#header-wrapper {
position: relative;
top: 0px;
right: 30px;
width:720px;
height:183px;
margin:0 auto 10px;
border:0px solid $bordercolor;
background-image: url(http://www.imagehost.ro/pict/1918552047694cf81ae36.png)
}