relojes blogs

8.2.12

Entradas populares en horizontal


Comparte esta historia en:
Uno de los gadgets mas utilizados en blogger es sin duda el gadget de "Entradas populares". Pero a este podemos cambiarlo de aspecto con un pequeño código, de esta forma lo podrás colocar debajo de la cabecera, a lo largo, debajo del bloque de las entradas o incluso arrastrarlo al footer para presentar los "Post popular" al final de la página.

Lo primero que haremos será ir a editar nuestra plantilla en HTML, ahí daremos la medida máxima del gadget que debe coincidir con la largura de #outer-wrapper, buscamos su medida (Ejem. width: 980px) y la definimos colocando el siguiente código antes de ]]></b:skin>

#content-wrapper{margin: 0 auto; width: 990px}


El valor 990 debe ser cambiado por la largura de #outer-wrapper


Una vez redimensionado pegamos a continuación de lo anterior y también encima de ]]></b:skin> este otro código:



#crosscol-wrapper{margin: 0 auto; padding: 0px}
#PopularPosts1{width: 100%; margin: 0px auto; padding: 5px 0px} /*define que o widget ocupe 100% de largura */
#PopularPosts1 h2{font-size:18px;text-align:left; border-bottom: 1px dotted #fff} /*estilo para o título do widget */
.PopularPosts .widget-content{float:left;margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;}
.PopularPosts .widget-content ul {margin: 0px auto;padding: 0px 0px;width: 100%; list-style:none; } /* estilo para a lista de posts */
.PopularPosts .widget-content li {margin: 0px 6px 10px 6px;width: 182px;padding: 0px;height: 180px; overflow:hidden;list-style:none; float:left; border: 1px solid #fff;} /*estilo para cada item da lista. Altere os valores de width, height, border, etc, para que se encaixem na largura total. */
.item-content{font-size: 12px; text-align:left; padding: 5px 10px} /* estilo para o resumo do post */
.PopularPosts img{margin: 0px 0px;padding: 4px; background: #fff; float:right} /*estilo para a imagem */
.PopularPosts .item-title{line-height:1.3em} /* estilo para o titulo de cada post */


Guarda los cambios y en diseño arrastras el gadget donde mas te interese, es todo.

0 Comentarios :

¿Quieres comentar algo?




Estado del blog

entradas
comentarios
1.467 followers
168 seguidores
 días online



Comentarios recientes

 
© Copyright 2009 - 2015 | Contacto | Seguir este blog | Sobre mi | Facebook | Twitter | LinkedIn | Mapa del sitio | Tienda | Conversor | RSS |

@duque71 2015