Etiquetas divididas en cuatro columnas encima del pié del blog

Tras haber publicado el truco para tener las etiquetas, las entradas y los enlaces de la sidebar en dos columnas, me quedé con ganas de crear otro truco similar.
Ayer por la tarde tuve el suficiente tiempo para inventar el interesante procedimiento de incluir nada más y nada menos que cuatro columnas de etiquetas encima del footer (pié del blog)...

Diseño>edición HTML>expandimos artilugios

Busca la etiqueta ]]></b:skin> y encima añade estos bloques de CSS:

#etiquetasbloque {
width:870px;
text-align:left;
margin:0 auto 10px;
line-height: 1.6em;
clear:both;
padding-top: 12px;
}

.etiqueta {
color: #000000;
line-height: 1.5em;
}

.etiqueta .widget {
padding:0 0 1.5em;
margin:0 .4em 1.5em .4em;
}

.etiqueta ul {
list-style:none;
margin:0 0 0;
padding:0 0 0;
}
.etiqueta ul li {
float:left;
list-style-type: none;
width:20%;
margin: 0 0 5px;
background: transparent url(http://www.iconfinder.net/data/icons/silk2/bullet_green.png) no-repeat left center;
padding-left: 15px;
}

.etiqueta:hover {
color: #999999;
}

Ahora busca esta línea:

<div id='footer-wrapper'>

Y encima agrega lo siguiente:

<div id='etiquetasbloque'>
<b:section class='etiqueta' id='etiqueta'>
<b:widget id='Label112' locked='false' title='Etiquetas' type='Label'>
</b:widget>
</b:section>
</div>

Con este paso finalizamos el truco. Puedes ver el resultado en vista previa.

Guarda cambios para terminar.

Jaime Trujillo Escobedo
Canovu



http://elbalcondejaime.blogspot.com/2009/09/etiquetas-divididas-en-cuatro-columnas.html

Read more...