Ad Menu

menu orizzontale multilivello

lunedì 7 settembre 2009

3

Voglia di cambiare: FOOTER a tre colonne nel blog

Bacio_al_computerVi piace la mia ultima modifica apportata in fondo al template? Un footer meno vistoso del precedente e più contenuto anche, non vi pare?



Queste sono le istruzioni che ho seguito. Ne avevo trovate tante, ma queste che vi indico sono le uniche che hanno funzionato – almeno nel mio template:
1. Eseguire una copia di sicurezza del template
2. Rimuovere tutti i widget dal footer
3. Aggiungere il codice al footer del template
In bacheca > layout > modifica html (senza espandere i modelli widget) individuate questa sezione del codice:

<div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
</div>

Sostituite la parte evidenziata in rosso con questo codice:

<div id='footer-column-container'>
<p>
<hr align='center' color='#5d5d54' width='90%'/></p>
<div id='footer2' style='width: 30%; float: left; margin:0; text-align: left;'>
<b:section class='footer-column' id='col1' preferred='yes' style='float:left;'/>
</div>
<div id='footer3' style='width: 40%; float: left; margin:0; text-align: left;'>
<b:section class='footer-column' id='col2' preferred='yes' style='float:left;'/>
</div>
<div id='footer4' style='width: 30%; float: right; margin:0; text-align: left;'>
<b:section class='footer-column' id='col3' preferred='yes' style='float:right;'/>
</div>
<div style='clear:both;'/>
<div id='footer-bottom' style='text-align: center; padding: 10px; text-transform: lowercase;'>
<b:section class='footer' id='col-bottom' preferred='yes'>
<b:widget id='Text2' locked='false' title='' type='Text'/>
</b:section>
</div>
<div style='clear:both;'/>
</div>

4. Aggiungere uno stile al footer
Via bacheca > layout > modifica html (senza espandere i modelli widget) individuate la tag di chiusura </b:skin> e subito prima incollate questo:

#footer-column-container {
clear:both;
}
.footer-column {
padding: 10px;
}

5.Fatto. Il tuo footer ha le tre colonne! Ora puoi rimettere i widget che avevi spostato (magari risistemandoli in larghezza).

Che ne dite?

Naturalmente questo è il link al post originale. Non è farina del mio sacco! (E quando mai…)

3 puntini di sospensione:

rosa sui libri

Java script dei numeri pagina blog

post a caso

Denim Template © www.Blogger.com - Clear Template by http://lafarfallachescrive.blogspot.com

changed Altrodove Template by http://altrodoveblog.blogspot.com/

Non copiare, ma chiedi, linka e ti sarà dato!

I MONDI DELL'ALTRODOVE by Daniela Gambo is licensed under a Creative Commons Attribuzione-Non commerciale-Non opere derivate 2.5 Italia License.
Creative Commons License

«I Mondi dell'Altrodove» Copyright © 2008 di Daniela Gambo

Back to TOP