lunedì 20 aprile 2009

Aumentare la larghezza dei post sul blog (blogger/blogspot)

Questa guida si riferisce ai blog con dominio blogger.com / blogspot.com.

Dopo essere entrati a login nel proprio blog andate su LAYOUT-MODIFICA HTML

ESEGUITE SUBITO UNA COPIA DI BACKUP DEL VOSTRO TEMPLATE!!!

La figura seguente rappresenta la struttura del template del blog:


Come potete vedere outer-wrapper e' il contenitore che contiene il main-wrapper (la parte centrale con i post) e il sidebar-wrapper (la sidebar con tutti i suoi widget).

Torniamo al sorgente HTML del nostro template e cerchiamo la sezione seguente (alcuni dati potranno cambiare a seconda del template utilizzato):


/* Outer-Wrapper
----------------------------------------------- */
#outer-wrapper {
width: 1025px;
margin:0 auto;
padding:10px;
text-align:left;
font: $bodyfont;
}

#main-wrapper {
width: 530px;
margin-left: 20px;
float: left;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
}

#sidebar-wrapper {
width: 250px;
float: right;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
}

#newsidebar-wrapper {
width: 170px;
float: left;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
}

ESEGUITE SEMPRE UNA MODIFICA ALLA VOLTA E CONTROLLATENE IL RISULTATO MEDIANTE LA FUNZIONE DI ANTEPRIMA!!!!!

Cambiate la larghezza dell' outer-wrapper modificando il parametro width (1025px e' una misura decente sulla maggior parte dei monitor attualmente in giro).

Cambiate la larghezza del main-wrapper modificando il parametro width (Io al momento l'ho settato a 660px).

ATTENZIONE: la somma delle larghezze delle colonne e dei loro margini non devono superare la larghezza dell'outer-wrapper. In questo caso infatti la sidebar scivolerebbe sotto ai post abbandonando la sua posizione laterale.

2 commenti:

Alla Scoperta ha detto...

Abbiamo una proposta interessante per te

Superpapà ha detto...

grazie per l'ottima guida, utilissima